vue
Vue组件开发实例（详细注释）
Vue组件开发实例：<!DOCTYPEhtml><html><head><metacharset="UTF-8"><title></title><linkrel="stylesheet"href="SJStyle.css"/><...
Vue组件进阶知识总结
上一篇我们重点介绍了组件的创建、注册和使用，熟练这几个步骤将有助于深入组件的开发。另外，在子组件中定义props，可以让父组件的数据传递下来，这就好比子组件告诉父组件：“嘿，老哥，我开通了一个驿站，你把东西放到驿站我就可以拿到了。” 今天我们将着重介绍slot和父子组件之间的访问和通信。s...
Vue组件基础知识总结
组件系统是Vue.js其中一个重要的概念，它提供了一种抽象，让我们可以使用独立可复用的小组件来构建大型应用，任意类型的应用界面都可以抽象为一个组件树。 那么什么是组件呢？组件可以扩展HTML元素，封装可重用的HTML代码，我们可以将组件看作自定义的HTML元素。一、组件的创建和注册基本步骤 Vue.js的组件的...
Vue基础知识总结（二）
一、解决网速慢的时候用户看到花括号标记 （1）v-cloak，防止闪烁，通常用于比较大的选择器上。 给元素添加属性v-cloak，然后style里面：[v-cloak]{display:none;} （2）{{msg}}，等价于<spanv-text="msg"></span> （3）{...
Vue生命周期各阶段发生的事情
首先，参考之前一篇vue生命周期的总结：Vue生命周期总结 接下来我们来分析下官方文档经典流程图，每个阶段到底发生了什么事情。1、在beforeCreate和created钩子函数之间的生命周期 在这个生命周期之间，进行初始化事件，进行数据的观测，可以看到在created的时候数据已经和data属性进行绑定（放...
Vue生命周期总结
每个Vue实例在被创建之前都要经过一系列的初始化过程，这个过程就是vue的生命周期。 首先贴一张Vue文档给出的生命周期图示，并添加了一些注释： Vue2.0的生命周期钩子一共有10个，同样结合官方文档作出了下表生命周期钩子详细beforeCreate在实例初始化之后，数据观测(dataobserver)和ev...
Vue基础知识总结（一）
一、基本语法： 1、实例化：newVue({}) 2、el：一定是根容器元素（vue的作用域就是这个根元素内），就是写选择器 data：用于存储数据 methods：定义方法（方法里this指向当前vue实例化的对象，但是获取属性和方法不需要this.data....
Vue表单和组件
一、表单 v-model指令在表单控件元素上创建双向数据绑定，v-model会根据控件类型自动选取正确的方法来更新元素。<inputv-model="message"placeholder="编辑我……"><p>消息是:{{message}}</p>1、...
Vue自定义指令和路由
一、自定义指令 除了默认设置的核心指令(v-model和v-show)，Vue也允许注册自定义指令。 下面我们注册一个全局指令v-focus，该指令的功能是在页面加载时，元素获得焦点：<divid="app"><p>页面载入时，input元素自动获取焦点：</p><inpu...
Vue样式绑定和事件处理器
一、样式绑定 class与style是HTML元素的属性，用于设置元素的样式，我们可以用v-bind来设置样式属性。 v-bind在处理class和style时，专门增强了它。表达式的结果类型除了字符串之外，还可以是对象或数组。1、class属性绑定 我们可以为v-bind:class设置一个对象，从而动态的切换...
Vue计算属性和监听属性
一、计算属性 计算属性关键词：computed。计算属性在处理一些复杂逻辑时是很有用的。 可以看下以下反转字符串的例子：<divid="app">{{message.split('').reverse().join('')}}</div>//模板变的很复杂起来，也不容易看懂理解 使用了计算...
Vue条件与循环
一、条件判断1、v-if 条件判断使用v-if指令：2、v-else 可以用v-else指令给v-if添加一个"else"块：//随机生成一个数字，判断是否大于0.5，然后输出对应信息：<divid="app"><divv-if="Math.random()>0.5">Sorry<...
Vue模板语法
Vue.js使用了基于HTML的模版语法，允许开发者声明式地将DOM绑定至底层Vue实例的数据。Vue.js的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进DOM的系统。结合响应系统，在应用状态改变时，Vue能够智能地计算出重新渲染组件的最小代价并应用到DOM操作上。一、插值1、文本 数据绑定最常见的形...
Vue基本语法
每个Vue应用都需要通过实例化Vue来实现。 语法格式如下：varvm=newVue({//选项}); 让我们通过实例来看下Vue构造器中需要哪些内容：<divid="vue_det"><h1>site:{{site}}</h1><h1>url:{{url}}&l...
vue 组件，以及组件的复用
有时候代码的某一模块可能会经常使用到，那么完全可以把这一模块抽取出来，封装为一个组件，哪里需要用到的时候只需把模块调用即可。参考vue官方 https://cn.vuejs.org/v2/guide/components.html这里用一段代码<divid="components-demo">//...
