vue
旅行家小二
本人发布的文章仅用于记录个人技术难点,别嫌我菜乱喷
展开
-
vue-cli 2.x 多环境打包配置,根据打包命令生成不同的打包文件名
1.配置package.json "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", "unit": "jest --config test/unit/jest.conf.js --coverage", "e2e": "node test/e2e/runner.js", "li转载 2022-03-15 16:09:15 · 1179 阅读 · 0 评论 -
关于vue表单中使用v-if、v-else-if、v-else无法表单验证的问题?
解决方案就是给每个表单加key如:<el-form ref="ruleForm" :model="formData" :rules="rules"> <el-form-item label="名字" prop="name"> <el-input v-model="formData.name"></el-input> </el-form-item> <el-form-item label="年龄" pro原创 2022-01-05 14:32:53 · 774 阅读 · 0 评论 -
vue里的data为什么是函数而不是对象?
由于每个组件都是new Vue的实例,若data为对象,那么当改变其中一个组间数据时其他组件也会发生改变,为函数就不一样,有独立的作用域,组件之间互不干扰原创 2021-01-08 13:33:21 · 435 阅读 · 0 评论 -
vue中的$attrs和$listeners以及$props简介?
listeners包含了父作用域中的(不含.native修饰器的)v−on事件监听器,它可以通过v−on=”listeners包含了父作用域中的 (不含 .native 修饰器的) v-on 事件监听器,它可以通过 v-on=”listeners包含了父作用域中的(不含.native修饰器的)v−on事件监听器,它可以通过v−on=”listeners” 传入内部组件attrs包含了父作用域中非props特性绑定的属性(class和style除外)。当一个组件没有声明任何props时,这里会包含所有父作用原创 2020-11-26 13:47:40 · 303 阅读 · 0 评论 -
mapState的使用?
mapState作用:可以辅助获取到多个state的值转载 2020-11-04 10:52:26 · 560 阅读 · 0 评论 -
vue设置全局变量?
min.js中 Vue.prototype.$even=‘12’;原创 2020-11-03 16:59:13 · 90 阅读 · 0 评论 -
Vue.extend?
Vue.extend是一个全局的API,实际是创建一个构造器,并将其挂载到HTML的元素上(创建一个template标签)。可以通过propsData传参。 let Profile1=Vue.extend({ template: "<p>{{extendData}}--{{propsExtend}}</p>", props:['propsExtend'], data: function () { return {原创 2020-11-03 16:35:51 · 82 阅读 · 0 评论 -
keep-alive是什么?
keep-alive是一个抽象组件:它自身不会渲染一个DOM元素,也不会出现在父组件链中;使用keep-alive包裹动态组件时,会缓存不活动的组件实例,而不是销毁它们。原创 2020-09-28 15:04:38 · 117 阅读 · 0 评论 -
Vue内置组件?
Vue自带的标签有:component,transition,transition-group,keep-alive,slot原创 2020-09-28 14:19:27 · 79 阅读 · 0 评论 -
mapState的使用(常用)?
mapState作用:可以辅助获取到多个state的值怎么使用?1.在.vue组件中引入,在js块中引入import { mapState } from 'vuex'2.在.vue组件中定义一个对象computed:{...mapState([ //mapState本是一个函数,在里面写一个数组,记得加...‘num’ , //存的数据‘id’])}3.然后就可以不用$store.state.num引用了,直接插值{{num}}{{id}} //引用多个.转载 2020-09-16 15:46:51 · 1112 阅读 · 0 评论 -
vuex介绍?
vuex是专门为vue.js设计的状态管理架构,主要解决了不同页面之间的数据共享以及页面数据持久化。vuex有5个核心概念:1.state vuex的基本数据,用来存储数据2.getter 从基本数据派生的数据,相当于state的计算属性3.mutation 更新数据的方法,必须是同步的4.action 和mutation的功能类似,不同之处在于:action触发的是mutation,而不是直接变更状态,action可以包含任意异步操作5.modules 模块化vuex,可以让每个模块拥有自原创 2020-09-03 10:48:13 · 85 阅读 · 0 评论 -
vue底层原理?
1、双向数据绑定 vue的双向绑定是由数据劫持结合发布者-订阅者模式实现的,那么什么是数据劫持?说白了就是通过Object.defineProperty()来劫持对象属性的setter和getter操作,在数据变动时做你想要做的事情 ...转载 2020-08-30 19:51:50 · 86 阅读 · 0 评论 -
vue生命周期函数?
beforeCreate 数据和方法初始化之前created 数据和方法完成初始化beforeMount DOM渲染之前mounted 已经渲染DOMbeforeUpdate 数据更新之前update 数据更新完成之后beforeDestroy 实例销毁之前beforeDestroy 实例销毁之后...转载 2020-08-21 14:12:35 · 95 阅读 · 0 评论 -
如何优化Vue项目首屏加载速度慢的问题?
1、将公用的js库通过cdn引入2、配置路由时页面和组件使用懒加载方式,进一步缩小JS文件的体积,在进入某个路由和使用某个组件时再加载对应JS原创 2020-08-21 11:39:48 · 329 阅读 · 0 评论 -
Vue中给data中的对象属性添加一个新的属性时会发生什么,如何解决?
点击按钮数据改变了,视图没更新 原因是在Vue创建实例时,并没有声明obj.b,所以没有被转Vue换成响应式属性,自然就不会触发视图的更新,这时就需要使用Vue的全局api this.$set(this.obj, 'b', 'obj.b') <template> <div> <ul> <li v-for="value in obj" :key="value"> {{value}} <.转载 2020-08-21 11:10:34 · 1818 阅读 · 0 评论 -
vue中methods、computed、watch的区别?
1、methods需要函数方式调用,每次调用都会重新计算2、computed是属性调用的方式,拥有缓存功能,只有说依赖的数据发生改变时才会触发3、watch用于监听data里的数据,从而改变多条数据原创 2020-07-20 17:35:10 · 84 阅读 · 0 评论