小记录
##一：vue打包后把浏览器前缀去除了。兼容性没有了
改一下自己package.json中的，即可。
"browserslist": [//配置你需要兼容的浏览器或手机版本
"> 1%",
"last 2 versions",
"Android >= 3.2",
"Firefox >= 20",
"iOS >= 6",
"last 10 Chrome versions",
"last 5 Firefox versions",
"Safari >= 6",
"ie > 8"
]
##二.自定义字体图标
1.
2.
添加图标
3.
4.下载一份解压 (h5正常使用,小程序把iconfont.css改成iconfont.wxss)
5.打开文件修改css
6
6.全局引入css
7.项目中使用
8.后面添加或者删除icon,不需要重新下载修改
1).
生成代码链接并赋值打开新的网页能够看到代码
这种代码如果图标多会很长很长,可以替换成下面
把这一段赋值到css文件,其他的不变,然后使用也不变
也可以正常使用,dom中使用不变,暂时没有发现有什么不可以,
###总结:后面添加图标修改图标是在增加或删掉少数图标的使用,最好一次解决,先找好图标一次下载
##三.当数据有更新，在dom中渲染后，自动执行该函数，。vue $nexttick
##四.vue的过滤器的使用（多个参数传参，参数穿的顺序和接受的顺序是相反的）
局部过滤器
不传参和传参数
dom中
全局过滤器
https://www.cnblogs.com/xiterjia/p/6701324.html这边文章可以用
邮箱的正则表达式
/^[1-9a-zA-Z_]\w*@[a-zA-Z0-9]+(\.[a-zA-Z]{2,})+$/
手机号的正则表达式
/^[1][3,4,5,7,8][0-9]{9}$/
五.vue引入外部js文件，自定义函数
例如
1.新建calculation.js
calculation.js
2.在使用率不多的情况下局部引入js文件
compontents.vue
实例
3.全局引用,将这个方法注册全局,写到vue的原型上
(1)建立个js 文件（我的文件名为validate.js）， 写入该方法， 这里使用 exports.install 注册全局方法，挂载到vue原型上
exports.install = (Vue, options) => {Vue.prototype.validator = {lanenoTransf(val) {returnval.substr(2, 1) == '1' ? '出口' : '入口' } }}
然后在main.js中引入
import validator from '@/utils/validate'
Vue.use(validator)
最后页面上就可以直接使用
{ prop: 'laneno', label: '数据类型', formatData:this.lanenoTransf},
六. vue中使用vux微信里的前端组件
1.cnpm install vux --save
2.cnpm install vux-loader --save-dev
3.
七.vue授权登陆，回调地址
let redirect_uri ='http://www.91xsf.com/#/author'//授权登陆的中间页
window.location.href = 'https://open.weixin.qq.com/connect/oauth2/authorize?appid='+this.appid+'&redirect_uri='+encodeURIComponent(redirect_uri, "UTF-8")+'&response_type=code&scope=snsapi_userinfo&#wechat_redirect'
转一下就可以拿到你想回调的地址了，如果直接把地址拼进去会报错，微信#问题自行百度
// 全局钩子
router.beforeEach((to, from, next) => {
const toDepth = to.path.split('/').length
const fromDepth = from.path.split('/').length
if (toDepth < fromDepth) {
from.meta.keepAlive = false
to.meta.keepAlive = true
}
let login = localStorage.getItem('token')
let path = to.path
if (path === '/my') {
next()
return
}
if (login) {
if (path === '/') {
next({
path: '/'
})
} else {
next()
}
} else {
next({
path: '/my'
})
}
next()
});
判断执行内容
八.二维码生成器
https://blog.csdn.net/zhuswy/article/details/80267748
