vue 滚动到指定元素的底部 自定一个滚动指令:v-scroll 12345678910directives: { scroll: { inserted(el) { el.scrollIntoView({ block: "end", behavior: "smooth" vue2 #vue2 #web
vue-cli中 使用axios调接口数据交互 首先要安装了axiosnpm install axios --save 如下图:然后再main.js里配置下axios 12import Axios from 'axios'Vue.prototype.$axios=Axios 如下图:至此请求插件安装配置完毕下面获取下数据看看因为原生的样式太丑,我就用element了,那这样就需要安装和配置下element了,如下: 1np vue2 #vue2 #web
vue2计算属性:computed和侦听属性:watch computed计算属性:直接在视图层逻辑运算: 1234567891011121314151617181920<template> <view class="test"> {{ text.split('').reverse().join('') }} </v vue2 #vue2 #web
vue2 mixin混入【封装全局表格数据重置摁钮】 需求说明 基本上每个页面都有筛选数据的功能那么每个页面都写一遍重置按钮的方法吗?那就太臃肿了此处有更优方案,使用mxin: 功能封装1234567891011121314151617181920212223export default { methods: { resetFilter(form, method = "getData", fn) vue2 #vue2 #web
vue2 中的ref和$refs 定义: ref:用来给元素或子组件注册引用信息, 引用信息将会注册在父组件的 $refs 对象上。如果是在普通的DOM元素上使用,引用指向的就是DOM 元素,如果是在子组件上,引用就指向组件的实例。 $refs:是一个对象,持有已注册过 ref 的所有的子组件。 示例: 用在普通的DOM标签上: https://blog.csdn.net/qq_42618566/article vue2 #vue2 #web
vue2 使用cdn引入,性能优化之降低app.js的体积 配置vue.config.js文件: 123456chainWebpack: config => { config.plugin('html').tap(args => { args[0].CDNs = CDNs; return args });} index.html文件: 1234567891011121 vue2 #vue2 #web
vue2 使用ref获取并操作DOM元素 获取元素的方法有很多,但在vue中最好用vue提供的方法:ref。如下图,给想要操作的标签一个属性ref,然后给个值(就是你起的名字,下面要通过这个名字获取,跟原生的方法中class、id一样)起好名字后一定要去mounted钩子里操作,因为页面执行到这个钩子的时候已经渲染出DOM了。如下图:那么下载这个h3标签已经改成红色了 vue2 #vue2 #web
vue2 全局批量注册指令 directives 123456789101112131415161718const directives = { focus: (el) => { el.focus(); }, }export default { install(Vue) { Object.keys(directives).forEach(item => vue2 #vue2 #web #指令
vue2 全局批量注册过滤器 filters 12345678910111213141516171819202122232425262728293031export default { numberFormatter: (num, digits) => { const si = [ { value: 1E18, symbol: 'E' }, vue2 #vue2 #web #过滤器
vue2 动态变化标签的属性、事件 1234567891011121314151617181920212223242526272829303132<template> <div class=""> <el-button :[prop1]="'primary'" :[prop2]="'mini'" vue2 #vue2 #web