1、采用简洁的模板语法来声明渲染数据:

<div id="app">
{{ message }}
</div>

  

var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})

  修改方法:app.message = 新值

2、指令

v-bind 绑定

v-if 条件

v-for 举例

<div id="app-4">
<ol>
<li v-for="todo in todos">
{{ todo.text }}
</li>
</ol>
</div>

  

var app4 = new Vue({
el: '#app-4',
data: {
todos: [
{ text: '学习 JavaScript' },
{ text: '学习 Vue' },
{ text: '整个牛项目' }
]
}
})

  添加方式:在控制台里,输入 app4.todos.push({ text: '新项目' }),你会发现列表中添加了一个新项。

------ 先记着这么多,暂时够用目前需求

现在是2018年了,10月份末..31号 10:31:52

对于Vue,再之前经手的项目中,我又多次的代入使用,发现方便的确很方便。

暂时没有时间做任何经验之谈....

特此记录一下,待日后有空来写写

Vue.js自己从官网整理的东东的更多相关文章

  1. vue.js 与iview官网

    vue.js https://cn.vuejs.org/v2/guide/instance.html#生命周期图示 iview https://www.iviewui.com/components/t ...

  2. vue.js 2.0 官方文档学习笔记 —— 01. vue 介绍

    这是我的vue.js 2.0的学习笔记,采取了将官方文档中的代码集中到一个文件的形式.目的是保存下来,方便自己查阅. !官方文档:https://cn.vuejs.org/v2/guide/ 01. ...

  3. Vue.js开发去哪儿网WebApp

    一.项目介绍 这个项目主要参考了去哪儿网的布局,完成了首页.城市选择页面.详情页面的开发. 首页:实现了多区域轮播的功能,以及多区域列表的展示: 城市选择页面:在这个页面实现了城市展示.城市搜索.城市 ...

  4. 史上最全Beyond Compare中文文档.CHM (根据官网整理编辑)

    截图如下:  下载地址: 链接:https://pan.baidu.com/s/1Ml98_biT1leXxGLr9fqI_w 提取码:p8jg

  5. 关于Vue.js 使用v-cloak后仍显示变量的解决方法

    v-cloak   这个指令是防止页面加载时出现 vuejs 的变量名而设计的,但有时候添加了这个指令仍会显示变量,这是怎么回事呢?. v-cloak 用法: HTML代码: <div v-cl ...

  6. vue.js学习与实战笔记(1)

    公司需要开发一个小型官网,个人决定放弃angular2,使用vue来进行开发,由于是培训出生,思想一时难以转变,所以只能从零开始,下面奉上学习笔记 vue.js主要参考官网进行学习与开发 由于vue不 ...

  7. 【Vue】转-Vue.js经典开源项目汇总

    版权声明:本文为EnweiTech原创文章,未经博主允许不得转载. https://blog.csdn.net/English0523/article/details/88694219 Vue是什么? ...

  8. 【前端】Vue.js经典开源项目汇总

    Vue.js经典开源项目汇总 原文链接:http://www.cnblogs.com/huyong/p/6517949.html Vue是什么? Vue.js(读音 /vjuː/, 类似于 view) ...

  9. Vue.js经典开源项目汇总

    Vue.js经典开源项目汇总 原文链接:http://www.cnblogs.com/huyong/p/6517949.html Vue是什么? Vue.js(读音 /vjuː/, 类似于 view) ...

随机推荐

  1. 【Spring源码分析】原型Bean实例化过程、byName与byType及FactoryBean获取Bean源码实现

    原型Bean加载过程 之前的文章,分析了非懒加载的单例Bean整个加载过程,除了非懒加载的单例Bean之外,Spring中还有一种Bean就是原型(Prototype)的Bean,看一下定义方式: & ...

  2. 【learning】一般图最大匹配——带花树

    问题描述 ​ 对于一个图\(G(V,E)\),当点对集\(S\)满足任意\((u,v)\in S\),均有\(u,v\in V,(u,v)\in E\),且\(S\)中没有点重复出现,我们称\(S\) ...

  3. jqgrid 单元格引入时间datepicker控件

    简述原理:引入jquery-ui插件,设置好表格所需的字段变量以及字段属性1.设置colName与colModel colNames: ['过期时间''] colModel:[{       name ...

  4. 关于browser-sync(在多个设备上进行网页调试)的问题点总结

    最近在看响应式网站的开发视频,其中有一部分非常有用,就是在多个设备上进行网页调试,通过使用browser-sync来实现,具体的步骤可以参照官网(http://www.browsersync.cn/) ...

  5. 基于touch.js 左滑删除功能

    左滑删除功能 完整代码如下: (touch.js) <!DOCTYPE html> <html> <head> <meta charset="UTF ...

  6. OpenStack中的rabbitmq的配置方法

    OpenStack中的rabbitmq的配置方法 author:headsen chen   2017-10-11  17:24:58 个人原创,允许转载,转载请注明作者,出处,否则依法追究法律责任 ...

  7. 为什么会有可恶的腾讯电脑管家&怎么干掉它-电脑开机出现腾讯电脑管家-无法卸载腾讯电脑管家

    为什么会有可恶的腾讯电脑管家 怎么干掉它 电脑开机出现腾讯电脑管家 无法卸载腾讯电脑管家 某天,趁空闲,升级了一些常用软件,其中就升了新版电脑qq,晚上玩完电脑后关机睡觉,第二天早上开机.出现了图一: ...

  8. shiro授权

    一.shiro-permission.ini shiro-permission.ini里面的内容相当于在数据库 #用户 [users] #用户zhang的密码是123,此用户具有role1和role2 ...

  9. 1-1 spring基础

    1.spring是一个开源的轻量级的应用开发框架,它提供了IOC(Inversion of Control控制反转)和AOP(Aspect -Oriented Programming 面向切面编程)的 ...

  10. 机器学习(1) - TensorflowSharp 简单使用与KNN识别MNIST流程

    机器学习是时下非常流行的话题,而Tensorflow是机器学习中最有名的工具包.TensorflowSharp是Tensorflow的C#语言表述.本文会对TensorflowSharp的使用进行一个 ...