![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue.js
panzm_csdn
这个作者很懒,什么都没留下…
展开
-
Vue.js 起步
每个 Vue 应用都需要通过实例化 Vue 来实现。语法格式如下:var vm = new Vue({ // 选项})可以看到在 Vue 构造器中有一个el 参数,它是 DOM 元素中的 id。在上面实例中 id 为 vue_det,在 div 元素中:<div id = "vue_det"></div>这意味着我们接下来的改动全部在以上指定的 div 内,div 外...转载 2018-06-21 10:46:26 · 96 阅读 · 0 评论 -
vue-事件修饰符和按键修饰符
在事件处理程序中调用 event.preventDefault() 或 event.stopPropagation() 是非常常见的需求。尽管我们可以在 methods 中轻松实现这点,但更好的方式是:methods 只有纯粹的数据逻辑,而不是去处理 DOM 事件细节。 为了解决这个问题, Vue.js 为 v-on 提供了 事件修饰符。通过由点(.)表示的指令后缀来调用修饰符。.prevent...转载 2018-06-28 13:43:23 · 466 阅读 · 0 评论 -
全局过滤器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>private-filter</title> <script src="../vuejs/vue.min-1.0.28.js"原创 2018-06-28 11:04:10 · 464 阅读 · 0 评论 -
自定义私有过滤器
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>private-filter</title> <script src="../vuejs/vue.min-1.0.28.js"原创 2018-06-28 10:59:31 · 169 阅读 · 0 评论 -
Vue系统过滤器
vue本身提供了很多便利的过滤器,这里列举一下,具体的可以参考官方文档过滤器。例子中使用到的data和methodsdata:{ message: 'hello world', money: 12345, num: [1,2,3,4,5], obj: { name: 'Linda', a...转载 2018-06-28 10:35:00 · 258 阅读 · 0 评论 -
MVVM模式
一个常规软件或者 APP 一般都是服务于某种商业或者非商业述求,我们平常称为“业务需求”。随着业务需求的扩张、一个软件会变得越来越庞大,越来越复杂。所以一般都会有一套完整的架构设计、研发流程以及质量管理体系来保证整个研发过程。关于“架构设计”,这是一个很大的话题,伴随着我们的业务需求,它会涉及到方方面面,我们今天来谈一谈其中的一个基础环节——MVVM模式。经典的 MVC 模式MVC 是最常见的客户...转载 2018-06-20 10:59:22 · 195 阅读 · 0 评论 -
Vue js 的生命周期
用Vue框架,熟悉它的生命周期可以让开发更好的进行。首先先看看官网的图,详细的给出了vue的生命周期:它可以总共分为8个阶段:beforeCreate(创建前),created(创建后),beforeMount(载入前),mounted(载入后),beforeUpdate(更新前),updated(更新后),beforeDestroy(销毁前),destroyed(销毁后)然后用一个实例的demo...转载 2018-06-29 15:19:01 · 711 阅读 · 1 评论 -
vue-resource全攻略
Vue.js是数据驱动的,这使得我们并不需要直接操作DOM,如果我们不需要使用jQuery的DOM选择器,就没有必要引入jQuery。vue-resource是Vue.js的一款插件,它可以通过XMLHttpRequest或JSONP发起请求并处理响应。也就是说,$.ajax能做的事情,vue-resource插件一样也能做到,而且vue-resource的API更为简洁。另外,vue-resou...转载 2018-06-29 15:10:40 · 187 阅读 · 0 评论 -
v-if&v-show
今天来说一下vue中 v-if 和 v-show 的区别!一、v-if 和 v-show 在页面都展示为显示隐藏,但是它两有这本质的区别。 例如:<div v-if=""></div> 不同点:1 . v-if 当值为 true时,显示div ,当值为false时,改元素消失,代码也会消失,相当于将代码删除了,当在为true时,页面会重新渲染div; 而v-show 控制的...原创 2018-06-22 11:51:05 · 230 阅读 · 0 评论 -
v-for
我们用 v-for 指令根据一组数组的选项列表进行渲染。v-for 指令需要使用 item in items 形式的特殊语法,items 是源数据数组并且 item 是数组元素迭代的别名。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>原创 2018-06-22 11:19:23 · 113 阅读 · 0 评论 -
v-model
v-model:双向数据绑定<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-model</title> <script src="../vuejs/vue.min-1.0.28.原创 2018-06-22 10:48:30 · 275 阅读 · 0 评论 -
v-bind
作用 : 绑定标签属性,:后面是标签属性名<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-bind</title> <script src="../vuejs/vue.min-1原创 2018-06-21 16:45:05 · 171 阅读 · 0 评论 -
vue -- v-cloak解决刷新或者加载出现闪烁(显示变量)
在使用vue绑定数据的时候,渲染页面时会出现变量闪烁,例如<div class="#app"> <p>{{value.name}}</p></div>在加载的时候会看到{{value.name}}在页面出现,过了几秒之后才会渲染数据,在vue中有个指令可以解决这个问题,v-cloak那么,v-cloak要放在什么位置呢,是不是每个需要渲染数...转载 2018-06-21 16:15:43 · 159 阅读 · 0 评论 -
v-text&v-html
指令是vue自定义的以v-开头的自定义属性。每个不同的属性都有各自不同的意义和功能。v-指令名 = “表达式判断或者是业务模型中属性名或者事件名”。v-text:操作元素中的纯文本<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-te原创 2018-06-21 16:12:56 · 118 阅读 · 0 评论 -
v-on绑定事件
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>v-on</title> <script src="../vuejs/vue.min-1.0.28.js">&原创 2018-06-21 14:03:35 · 167 阅读 · 0 评论 -
vue 自定义指令
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>directive</title> <script src="../vuejs/vue.min-1.0.28.js"&原创 2018-06-28 15:08:59 · 104 阅读 · 0 评论