G-shitou的博客

vue指令 v-if     v-if指令可以完全根据表达式的值在DOM中生成或者移除一个元素。     v-if是惰性的，如果初始渲染条件为假，则什么也不做，在条件第一次变为真时才开始局部编译，编译会被缓存起来。 v-show     v-show指令是根据表...

Vuex 安装使用 在main.js同级目录下添加store文件夹,文件夹下新建index.js文件.index.js代码如下所示 import Vue from 'vue'; import Vuex from 'vuex'; Vue.use(Vuex); //要设置的全局访问的state对象 const state = { count1: 1, count2: 2 }; cons...

Vue使用vee-validate表单校验 本文章主要分享作者在使用vee-validate时的用法和常用配置操作. 1.安装和使用 // 安装 npm install vee-validate --save // 使用 import VeeValidate, { Validator } from 'vee-validate'; // 引用中文信息提示 import zh from 'vee-v...

安装 npm安装 npm install vue-router 在项目中使用 import Router from 'vue-router' Vue.use(Router) 路由的使用 在main.js同级目录新建router文件夹,并在router文件夹中新建index.js,在index中配置各个路由对应的跳转的组件.因各个项目结构不同,请参考以下例子. // index.js中的配置 ...

Axios Axios是一个基于promise的HTTP库，可以用在浏览器和node.js中. 通过npm 使用axios npm install axios 也可以在项目中使用cdn引入axios get请求 // 不指定post和get方式,会默认为get方式 axios('/home'); // 指定id的get请求 axios.get('/home?ID=001') .then...

vue在实现过渡动画遇到的问题 本文只分享在用vue的过渡类名做过渡效果时遇到的一些问题.不再过多介绍具体实现方法. 了解vue的过渡动画详情请看vue官网过渡&动画. 了解贝塞尔函数请点击这里. 效果预览请点击这里.或扫描下方二维码 开始写的代码结构如下,发现并不能触发动画,而是直接显示最终效果,既没有过渡时间,也没有过渡路线. new Vue({ el: '#examp...

      vue2.0废弃了内置过滤器，允许自定义过滤器。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式 (后者从 2.1.0+ 开始支持)。过滤器应该被添加在 JavaScript 表达式的尾部，由“管道”符号指示。 <!-- 在双花括号中 --> {{ message | capitalize }} ...

    v-model 指令可以在表单控件上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。 text <input v-model="message" placeholder="edit me"> <p>Message is: {{ message }}</p>  

    通常我们在模板内的表达式计算，他非常便利，简单运算还可以，但是复杂运算就变的很臃肿，难以维护。于是对于任何复杂逻辑，都应当使用计算属性。例如： <div id="example"> <p>{{ msg }}</p> <p>{{ myMsg }}</p> &a

除了内置的指令外，Vue 也允许注册自定义指令。 vue用Vue.directive(id,definition)方法注册一个全局自定义指令，它接受两个参数，指令ID和定义对象。也可以用directives注册一个局部自定义指令。 // 注册一个全局自定义指令 `v-my-directive` Vue.directive('my-directive', { // 钩子函数 当指令...

Vue的响应式原理（一）        Vue数据响应式原理的解读有很多文章，此文只分享我对于Observer,Dep,Watcher的实现理解，希望此文对刚接触Vue的开发者有所帮助。 Observer、Dep、Watcher简介 Observer：数据的观察者，让数据对象的读写操作都处于自己的监管之下。当初始化实例的时候，会递归遍历data，用Obje...