插值
文本(输出文本):{{ }}或v-text
Html(输出Html):v-html

监听属性
常用于表单输入时要进行的动作
watch : {
  dataValue:function(val) {

  }
}

指令
v-text=表达式”               设置标签中的文本
v-html                          设置标签中的html
v-if                               控制是否有元素,v-if="isDelete"
v-for                             循环
v-show                          控制元素隐藏,如 v-show="isShow"
v-model                         数据双向绑定(用于表单),如 <input type="text" v-model="name">
v-on                              注册事件,如 v-on:click="func"
v-bind:                          绑定属性(title、class、href等)或对象,如<a v-bind:href="toUrl">

v-if与v-show的区别:
v-if是根据值从Dom树增加或删除节点
v-show是根据值来控制元素的显示或隐藏,即控制display样式

v-bind和v-model的区别:
通过 v-bind:value 也可以实现对表单赋值,但v-bind绑定数据是单向得,而v-model双向数据绑定

Vue学习笔记-基本语法的更多相关文章

  1. vue学习笔记 模板语法(三)

    <div id="kk"> <div>直接输出文本:{{msg}}</div> <div>自定义过滤器输出文本:{{msg|capi ...

  2. Vue学习笔记-2

    前言 本文非vue教程,仅为学习vue过程中的个人理解与笔记,有说的不正确的地方欢迎指正讨论 1.computed计算属性函数中不能使用vm变量 在计算属性的函数中,不能使用Vue构造函数返回的vm变 ...

  3. vue学习笔记(八)组件校验&通信

    前言 在上一章博客的内容中vue学习笔记(七)组件我们初步的认识了组件,并学会了如何定义局部组件和全局组件,上一篇内容仅仅只是对组件一个简单的入门,并没有深入的了解组件当中的其它机制,本篇博客将会带大 ...

  4. vue学习笔记(十)路由

    前言 在上一篇博客vue学习笔记(九)vue-cli中的组件通信内容中,我们学习组件通信的相关内容和进行了一些组件通信的小练习,相信大家已经掌握了vue-cli中的组件通信,而本篇博客将会带你更上一层 ...

  5. vue学习笔记(三)class和style绑定

    前言 通过上一章的学习vue学习笔记(二)vue的生命周期和钩子函数,我们已经更近一步的知道了关于vue的一些知识,本篇博客将进一步探讨vue其它方面的内容,vue中关于class和style绑定,关 ...

  6. Vue学习笔记-Vue.js-2.X 学习(六)===>脚手架Vue-CLI(项目说明-Babel)

    五  Vue学习-vue-cli脚手架学习(创建只选一个选项:Babel) 1. 项目目录说明 node_modules : 包管理文件夹 public : 静态资源 src : 源代码 gitign ...

  7. Vue学习笔记-Vue.js-2.X 学习(四)===>脚手架Vue-CLI(基本工作和创建)

    (五) 脚手架Vue-CLI 一 Vue-CLI前提(nodejs和webpack) 二  Vue学习-nodejs按装配置,Node.js 就是运行在服务端的 JavaScript. 1. 去nod ...

  8. Vue学习笔记-Vue.js-2.X 学习(二)===>组件化开发

    ===重点重点开始 ========================== (三) 组件化开发 1.创建组件构造器: Vue.extends() 2.注册组件: Vue.component() 3.使用 ...

  9. Vue学习笔记-Vue.js-2.X 学习(一)===>基本知识学习

    一  使用环境: windows 7 64位操作系统 二  IDE:VSCode/PyCharm 三  Vue.js官网: https://cn.vuejs.org/ 四  下载安装引用 方式1:直接 ...

随机推荐

  1. Selenium-Switch与SelectApi接口

    Switch 我们在UI自动化测试时,总会出现新建一个tab页面.弹出一个浏览器级别的弹框或者是出现一个iframe标签,这时我们用WebDriver提供的Api接口就无法处理这些情况了.需要用到Se ...

  2. 新xcode的literal syntax是什么

    New Objective-C Literal Syntax for NSArray, NSDictionary 是以@字符开始的方式简单地创建数组.字典.NSNumber常量. 代码如下: NSNu ...

  3. Java练习 SDUT-1188_各位数字之和排序

    C语言实验--各位数字之和排序 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 给定n个正整数,根据各位数字之和从小到大 ...

  4. 20172018-acmicpc-southeastern-european-regional-programming-contest-seerc-2017-en A - Concerts

    题意就是给一个字母序列a,以及一个另外一个字母序列b,你需要b中找到字母序列a,并且要求对于在b中的字母序列a,每个单词都需要满足相应的距离 其实很简单,我们利用DP[i][j]代表a已经匹配i个位置 ...

  5. [USACO07JAN]区间统计Tallest Cow

    前缀和 sum[i]表示前i个数的和 每次读入a[i]的时候 sum[i] = sum[i - 1] + a[i]; 查询l ~ r区间的和: sum[r] - sum[l - 1] 差分 即前缀和的 ...

  6. 消息点击率翻倍的背后——闲鱼无侵入可扩展IFTTT系统

    一.面临问题 在闲鱼生态里,用户之间会有很多种关系.其中大部分关系是由买家触发,联系到卖家,比如买家通过搜索.收藏.聊天等动作与卖家产生联系:另外一部分是平台与用户之间的关系.对这些关系分析之后我们发 ...

  7. ng-model 将时间戳转换为标准时间

      html部分 <div class="form-group loginCon1"> <label class="col-sm-2 control-l ...

  8. Websocket 群聊功能

    websocket 群聊 前提关闭防火墙 写入代码 from flask import Flask,request,render_template from geventwebsocket.handl ...

  9. centos安装hdp

    1. 准备6和7的 YUM源包 1.1 centos 下载后解压到同一个目录 http://mirrors.163.com/centos/6/isos/x86_64/CentOS-6.9-x86_64 ...

  10. H3C IP及其相关协议