随笔分类 -  Vue

类angularjs 的轻量js库
摘要:全局化注册组件 html <div id="app"> <!-- 注册一个全局逐渐 --> <register></register> </div> js var demo = Vue.component('register',{ template:"<h2>{{message}}</h2>", d 阅读全文
posted @ 2017-06-04 16:49 xuanPhoto 阅读(189) 评论(0) 推荐(0) 编辑
摘要:直接写在选项里的模板 直接在构造器里的template选项后边编写。这种写法比较直观,但是如果模板html代码太多,不建议这么写。 var vm = new Vue({ el:"#app", template:` <h2>直接在构造器里的template选项后边编写。这种写法比较直观,但是如果模板h 阅读全文
posted @ 2017-06-04 16:46 xuanPhoto 阅读(186) 评论(0) 推荐(0) 编辑
摘要:Vue一共有10(严格说应该是8个,总数是10个 因为有两个是属于存在keep-alive才会生效的生命周期)个生命周期函数,我们可以利用这些函数在vue的每个阶段都进行操作数据或者改变内容。 其实在Vue的官网有一张图已经很好的诠释了生命周期,我在这里就不再多讲了,直接贴图,然后上程序代码。 ht 阅读全文
posted @ 2017-06-04 16:43 xuanPhoto 阅读(631) 评论(0) 推荐(0) 编辑
摘要:html html js 阅读全文
posted @ 2017-06-04 16:40 xuanPhoto 阅读(427) 评论(0) 推荐(0) 编辑
摘要:Vue.extend 返回的是一个“扩展实例构造器”,也就是预设了部分选项的Vue实例构造器。经常服务于Vue.component用来生成组件,可以简单理解为当在模板中遇到该组件名称作为标签的自定义元素时,会自动调用“扩展实例构造器”来生产组件实例,并挂载到自定义元素上。 自定义无参数标签 我们想象 阅读全文
posted @ 2017-06-04 16:37 xuanPhoto 阅读(258) 评论(0) 推荐(0) 编辑
摘要:Vue除了内部指令,我们也可以定义一些属于自己的指令,比如我们要定义一个v-diy的指令,作用就是让文字变成红色。 写好了这个功能,我们现在就自己定义一个全局的指令。我们这里使用Vue.directive( ); html <div v-diy="color">{{message}}</div> j 阅读全文
posted @ 2017-06-04 16:32 xuanPhoto 阅读(190) 评论(0) 推荐(0) 编辑
摘要:什么是全局API? 全局API并不在构造器里,而是先声明全局变量或者直接在Vue上定义一些新功能,Vue内置了一些全局API,比如我们今天要学习的指令Vue.directive。说的简单些就是,在构造器外部用Vue提供给我们的API函数来定义新的功能。 阅读全文
posted @ 2017-06-04 16:24 xuanPhoto 阅读(135) 评论(0) 推荐(0) 编辑
摘要:html 阅读全文
posted @ 2017-06-04 11:13 xuanPhoto 阅读(289) 评论(0) 推荐(0) 编辑
摘要:v-model双向数据绑定的修饰符 .lazy:失去焦点时数据进行双向的绑定 v-model.lazy=”message ” .number:前面输入数字,后面接着字母自动去除掉。v-model. number =”message ” .trim:去掉打头的空格,内容之间还是可以产生空格。 v-mo 阅读全文
posted @ 2017-06-04 10:53 xuanPhoto 阅读(289) 评论(0) 推荐(0) 编辑
摘要:v-if和v-show区别 v-if判断是否要加载,可以减轻服务器压力,按需加载。 v-show 利用了css的display,可以提高客户端的流畅度。 看需求使用那个,如果页面上会经常用到,用v-show,例如tab栏等。 根据用户的需求加载的用v-if,选择性的向服务器请求加载,例如,瀑布流,懒加载等 阅读全文
posted @ 2017-06-04 10:50 xuanPhoto 阅读(199) 评论(0) 推荐(0) 编辑
摘要:用npm 或者cnpm进行全局安装 cnpm install -g live-server 运行后就可以直接给你虚拟一个本地服务器,而且还可以热同步 运行 live-server 或者安装使用 http-server (不能像live-server一样热更新) 安装完之后可以通过 http-serv 阅读全文
posted @ 2017-06-04 10:48 xuanPhoto 阅读(332) 评论(0) 推荐(0) 编辑
摘要:一、class的四种绑定方式 <div id="demo"> <span v-bind:class="{'class-a':isA ,'class-b':isB}"></span> </div> var vm = new Vue({ el:"#demo", data:{ isA: true, isB 阅读全文
posted @ 2017-05-21 19:22 xuanPhoto 阅读(555) 评论(0) 推荐(0) 编辑
摘要:使用 vuejs 做了一个简单的功能页面,逻辑是,页面加载后获取当前的经纬度,然后通过 ajax 从后台拉取附近的小区列表。但是 bug 出现了,在显示小区列表之前,会闪现小区名对应的 vuejs 变量名。 案发现场的 HTML 代码 <ul v-for="item in items"> <li>{ 阅读全文
posted @ 2016-12-26 13:22 xuanPhoto 阅读(312) 评论(0) 推荐(0) 编辑
摘要:push() 向数组的末尾添加一个或多个元素 pop() 删除数组内部并返回数组的最后一个元素 shift() 把数组内部的第一个元素从其中删除,并返回第一个元素的值 unshift() 向数组外部的开头添加一个或更多元素,并返回新的长度 splice() 从数组中添加/删除项目,然后返回被删除的项 阅读全文
posted @ 2016-12-02 10:47 xuanPhoto 阅读(516) 评论(0) 推荐(0) 编辑
摘要:首先明确一个概念 方法和事件 能够响应的是事件 执行动作的是方法 方法和事件可以结合使用 events 事件 事件配合外部响应的钩子 $emit 阅读全文
posted @ 2016-12-02 10:46 xuanPhoto 阅读(168) 评论(0) 推荐(0) 编辑
摘要:结合管道符 | {{messageOne | capitalize}} capitalize 首字母大写 {{messageOne | uppercase}} uppercase 大写字母 {{messageTwo | currency '¥' 0}} currency 货币联合符 后面的0 是说小数点后面显示几个0 写3就跟着三个0 {{messageThree}}... 阅读全文
posted @ 2016-12-02 10:21 xuanPhoto 阅读(284) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示