
vue
liukai6
这个作者很懒,什么都没留下…
展开
-
Vue表格数据实例
下面是使用vue来处理的表格数据实例<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="app"> <table> <tr> <td>原创 2018-03-22 10:29:56 · 3716 阅读 · 0 评论 -
vue中element-ui中的加载中状态
需要添加加载状态,调用下面方法即可 //开启loading const load = _this.$loading({ lock: true, text: 'Loading', spinner: 'el-icon-loading', ...原创 2018-06-20 16:59:35 · 8106 阅读 · 1 评论 -
vue中使用watch监视对象中的属性的方法
单层监控直接写该变量的方法,但是深度监控 watch:{ //方式一:监控vue实例的数据 age:(newValue,oldValue) => { console.log('name的newValue值为:'+newValue+',旧值为:'+oldValue); ...原创 2018-07-04 19:46:47 · 2565 阅读 · 0 评论 -
mint ui indicator的使用
//打开加载 _this.$indicator.open({ text: '充值中....', spinnerType: 'fading-circle' }); //关闭加载 _this.$indicator.close();原创 2018-09-07 12:26:50 · 11743 阅读 · 8 评论 -
Do not use built-in or reserved HTML elements as component id
这时候注意是不是组件的名称和系统的产生冲突导致的原创 2018-09-14 12:17:56 · 1629 阅读 · 0 评论 -
weex项目的初始化
创建一个weex应用 我们使用weex-toolkit来创建weex 安装weex-toolkit npm install weex-toolkit -g 创建一个app weex create weex-project ###开发 cd weex-project npm install npm start 这样就可以调用一个本地的web服务器 ...原创 2018-09-24 21:07:06 · 538 阅读 · 0 评论 -
Cannot read property 'protocol' of undefined!
如果在使用vue和axios时,报这样的错误,看看是不是将vue.use(axios).这样是不对的,直接引入使用就可以了原创 2018-09-14 18:21:38 · 4271 阅读 · 0 评论 -
vue对数据进行赋值的时候,有时候可能存在数据没有及时更新
使用下面函数完成数据视图的更新操作 this.$forceUpdate();原创 2018-11-06 10:23:43 · 4514 阅读 · 0 评论 -
使用vue的set()
当我们给一个比如props中,或者data中被观测的对象添加一个新的属性的时候,不能直接添加,必须使用Vue.set方法 Vue.set方法用来新增对象的属性。如果要增加属性的对象是响应式的,那该方法可以确保属性被创建后也是响应式的,同时触发视图更新. 使用vue.set是很有必要性的 ...原创 2018-11-06 14:43:47 · 540 阅读 · 0 评论 -
You are binding v-model directly to a v-for iteration alias.
<script src="//cdnjs.cloudflare.com/ajax/libs/vue/2.5.18/vue.js"></script> <table id="app"> <tr v-for="(run, index) in settings.runs"> <td> &原创 2019-01-22 20:11:57 · 2876 阅读 · 1 评论 -
vue动态在页面添加背景图片
<div class="home-logo" :style="{backgroundImage:'url('+config.data.logo+')'}"></div>原创 2019-03-05 21:18:10 · 5512 阅读 · 0 评论 -
常见的vue的路由方式
router.push(location) // 字符串 router.push('home') // 对象 router.push({path: 'home'}) // 命名的路由 router.push({ name: 'user', params: { userId: 123 }}) // 带查询参数,变成 /...原创 2019-03-29 22:43:55 · 366 阅读 · 0 评论 -
vue绑定事件的修饰符-转换输入类型number
.lazy 在默认情况下,v-model 在每次 input 事件触发后将输入框的值与数据进行同步 (除了上述输入法组合文字时)。你可以添加 lazy 修饰符,从而转变为使用 change 事件进行同步: <input v-model.lazy="msg" > .number 如果想自动将用户的输入值转为数值类型,可以给 v-model 添加 number 修饰符: <...原创 2018-06-15 00:25:36 · 12845 阅读 · 2 评论 -
vue中数据更新检测
在vue中数据变化,会触发视图进行更新 下面列出这几个数组 - push() - pop() - shift() - unshift() - splice() - sort() - reverse() 需要注意的是 当你利用索引直接设置一个项时,例如:vm.items[indexOfItem] = newValue 当你修改数组的长度时,例如:vm...原创 2018-06-15 00:23:31 · 1242 阅读 · 0 评论 -
vue的侦听器
首先要了解侦听器的作用 Vue 通过 watch 选项提供了一个更通用的方法,来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时,这个方式是最有用的。 具体的写法如下: var watchExampleVM = new Vue({ el: '#watch-example', data: { question: '', answer: '...原创 2018-06-15 00:12:09 · 2159 阅读 · 1 评论 -
element-UI中input独自占一行
在使用element-UI中input独占一行我们可以给input表单添加宽度来解决,例如: style=”width:100px” 这样来指定宽度来解决原创 2018-04-26 10:53:55 · 22920 阅读 · 1 评论 -
使用vue-cli来初始话vue项目
我们使用vue-cli来初始化项目 首先要保证node安装正确 我们使用 npm install -g vue-cli 全局安装vue-cli 初始化项目 vue init webpack project_name 进入项目目录 执行安装扩展命令npm install 然后运行npm run dev 完成这个时候回出现一个地址,现在去访问以下,看看是否已经安装成功 ...原创 2018-05-14 20:54:22 · 241 阅读 · 0 评论 -
在VUE渲染前不允许页面是显示内容
在vue变量未渲染前,会有一瞬间显示代码,影响代码美观。vue有现成的指令来解决这个问题:v-cloak 在css中加入: [v-cloak]{ display: none; } 在需要元素加上: <div v-cloak> {{demo}} </div> 这样,v-cloak所在元素下的变量在未渲染前不会显示。...原创 2018-05-15 10:19:17 · 3832 阅读 · 1 评论 -
vue的ui框架element-UI的弹出框范例
提示消息 this.$message(‘这是一条消息提示’); 成功的消息 this.$message({ message: ‘恭喜你,这是一条成功消息’, type: ‘success’ }); 警告消息 this.$message({ message: ‘警告哦,这是一条警告消息’, type: ‘warning’ }); 错误消息 this.$mes...原创 2018-05-23 14:30:19 · 17653 阅读 · 0 评论 -
Vue手机mintui提供的icon字体
提供的icon的class标签 <i class="mint-toast-icon mintui mintui-more"></i> <i class="mint-toast-icon mintui mintui-back"></i> <i class="mint-toast-icon mintui min原创 2018-06-11 14:18:04 · 4527 阅读 · 0 评论 -
vue文件夹的意义
build 保存一些webpack的初始化配置 config 保存项目初始化的配置 node_modules 是npm加载的项目依赖的模块 src 是我们需要的开发的模块 assets 用来放置图片等资源的 components 用来放置组件文件 app.vue 是项目的入口,相当于一个组件 main.js 是项目的核心文件 static 用来放置静态资源...原创 2018-06-11 21:19:13 · 1158 阅读 · 0 评论 -
vue的生命周期
vue的生命周期,和微信的小程序很像 它可以总共分为8个阶段: beforeCreate(创建前), created(创建后), beforeMount(载入前), mounted(载入后), beforeUpdate(更新前), updated(更新后), beforeDestroy(销毁前), destroyed(销毁后) 然后用一个实例的demo 来演示一下具体的效果: ...原创 2018-05-24 23:12:47 · 194 阅读 · 2 评论 -
vue的条件渲染v-if和v-show
v-if和v-else 他们决定是否要渲染出来dom元素,和其子元素 需要注意的是v-else一定要跟着v-else否则没有作用,也可以和v-show搭配使用 v-show和v-if 区别在于v-if引起dom的变化,而v-show只是发生了样式的改变,v-show的消耗要比v-if小...原创 2018-05-24 23:33:29 · 433 阅读 · 0 评论 -
Vue实例生命周期
首先要明白什么是生命周期 每一个Vue实例化都要经过一系列的初始化的过程,需要设置数据的监听,编译模板,将实例挂载到dom上,更新dom等等. created钩子 这个钩子就是实例被创建之后的代码,常见的还有其他钩子,像mounted,updated,destroyed. 下图vue的声明周期 ...原创 2018-06-13 00:13:08 · 242 阅读 · 0 评论 -
Vue中v-if和v-show的区别
v-if vs v-show v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。 v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。 相比之下,v-show 就简单得多——不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。 ...原创 2018-06-13 00:36:44 · 352 阅读 · 0 评论 -
Mint-UI中定义input最多输入的字符数(设置原生属性的方法)
设置input的长度 设置原生属性,例如 :attr=”{ maxlength: 10 }”原创 2018-06-22 20:24:55 · 5095 阅读 · 0 评论 -
在ie中vue使用axios中产生的兼容性问题
npm install es6-promise --save-dev /*main.js下*/ import promise from 'es6-promise' promise.polyfill()原创 2019-03-29 22:46:21 · 586 阅读 · 0 评论