Vue详细介绍模板语法和过滤器的使用!
表达式
{{ XXX }}
使用过滤器
{{ XXX | yyy}}
使用多个过滤器
{{ XXX | yyy | yyy1}}
过滤器带参数
{{ XXX | yyy(123,"zhuiszhu") }}
动态属性:
<img v-bind:src="xxx" />
或 <img :src="xxx" />
绑定事件
<a v-on:click="xxx" />
或 <a v-on:click="xxx($event)" />
或 <a v-on:click="xxx($event,123)" />
或 <a v-on:click="xxx(123)" />
或 <a @click="xxx" />
指令:
v-if: 元素是否存在
v-else-if:
v-else 用法同js 的 if else if 及 else
注意 在使用了这几个指令的标签之间 不能存在其他元素
v-show: 元素是否显示
v-for: 循环迭代
<li v-for="item in list"></li>
或者
<li v-for="item in {name:'zhuiszhu',age:18}">
{{item}} ===> item值为 : zhuiszhu , 18
</li>
或者
<li v-for="item in 10"></li>
此时 item 值为: 1,2,3,4,5,6,7,8,9,10
获取索引
<li v-for="(item,i) in list"></li>
v-model: 数据双向绑定
全局过滤器
Vue.filter("name",function(value,sta1?,sta2?....){
return newValue
})
局部过滤器
let abc = function(value,sta1?,......){
return newValue
}
{
data: ...,
....,
fileters : {
name : abc
}
}
Vue详细介绍模板语法和过滤器的使用!的更多相关文章
- django “如何”系列4:如何编写自定义模板标签和过滤器
django的模板系统自带了一系列的内建标签和过滤器,一般情况下可以满足你的要求,如果觉得需更精准的模板标签或者过滤器,你可以自己编写模板标签和过滤器,然后使用{% load %}标签使用他们. 代码 ...
- 模板继承and自定义模板标签和过滤器
自定义模板标签和 过滤器: 因为模板标签和过滤器只给我们提供了 这么多 无法对我们的使用造成更多的便利 ,剩下的就需要我们自己去创建新的 模板标签和过滤器了 1.在settings中的INSTALLE ...
- Vue实例与模板语法
VUE基础使用方法 一.安装 1.NPM 在用 Vue 构建大型应用时推荐使用 NPM 安装[1].NPM 能很好地和诸如 webpack 或 Browserify 模块打包器配合使用.同时 Vue ...
- python3之Django内置模板标签和过滤器
一.模板标签 内置标签: 1.autoescape 控制当前的自动转义行为,此标记采用on或者off作为参数,并确定自动转义是否在块内有效.该块以endautoescape结束标签关闭. views: ...
- Django自定义模板标签和过滤器
1.创建模板库 在某个APP所在目录下新建包templatetags,然后在其中创建存储标签或者过滤器的的模块,名称随意,例如myfilters.py. 在这个模块中编写相关代码. 注意:templa ...
- 前端框架VUE——数据绑定及模板语法
一.数据绑定 Vue.js 的核心是一个允许采用简洁的模板语法来声明式地将数据渲染进 DOM 的系统: <div id="app"> {{ msg }} </di ...
- Django 自定义模板标签和过滤器
1.创建一个模板库 使用模板过滤器的时候,直接把过滤器写在app里,例如:在app里新建一个templatetags的文件夹,这个目录应当和 models.py . views.py 等处于同一层次. ...
- Django框架详细介绍---模板系统
Django模板系统 官方文档: https://docs.djangoproject.com/en/2.0/ref/templates/builtins/#std:templatetag-for 1 ...
- Django 内置模板标签和过滤器
一.内置模板标签 语法:{% %} autoescape : 是否转义,on或off作为参数,并确定自动转义是否在块内有效.该块以endautoescape结束 {% autoescape on % ...
随机推荐
- Java命令行传参
目的: 在运行一个程序时候再传递给它消息,这就需要传递命令参数给main()函数实现:即main()方法可以传递数据 例: public class demo{ public static void ...
- 虚拟机安装苹果macOS系统
Windows10系统虚拟机vmware15上装macos系统 一.简要步骤: 1.准备软件. 2.关闭VMware服务: 3.解压unlocker,运行文件: 4.启动vmware,选择macOS镜 ...
- 每天一套题打卡|河南省第八届ACM/ICPC
A 挑战密室 化学方程式求分子量 这题我懒得写了 可以用map<string,int>哈希表,表示每种分子的相对分子质量 之后,从头遍历到尾. 1.数字:连读直到不是数字 2.字母:连读直 ...
- xargs原理及用法详解
为什么需要xargs 管道实现的是将前面的stdout作为后面的stdin,但是有些命令不接受管道的传递方式,最常见的就是ls命令.有些时候命令希望管道传递的是参数,但是直接用管道有时无法传递到命令的 ...
- DRL强化学习:
IT博客网 热点推荐 推荐博客 编程语言 数据库 前端 IT博客网 > 域名隐私保护 免费 DRL前沿之:Hierarchical Deep Reinforcement Learning 来源: ...
- JavaScript中的对象与原型—你不知道的JavaScript上卷读书笔记(四)
一.对象 对象可以通过两种形式定义:声明(文字)形式和构造形式.即: var myObj = { key: value // ... }; 或: var myObj = new Object(); m ...
- 日常笔记4关于cin、cin.get()、cin.getline()、getline()使用区别
1.关于PAT中段错误 使用字符数组出现错误: char str[256]; 报错段错误,然后改用C++中的string 改成: string str; 同char数组一样,也可以使用下标来取单个字符 ...
- [LeetCode] 147. Insertion Sort List 链表插入排序
Sort a linked list using insertion sort. A graphical example of insertion sort. The partial sorted l ...
- 推荐一款运动步行App爱步行
推荐一款运动步行App爱步行 1 介绍 爱步行,是一款倡导健步运动.绿色生活.提升散步乐趣的APP,让大众在享受运动的同时,让用户的每一步都能产生价值.爱步行以步数为基础,用户在每天的行走过程中,可以 ...
- .NET CORE编写控制台程序应有的优雅姿势(转载)
原文地址:https://www.cnblogs.com/zuowj/p/11107243.html 本文所说的编写控制台程序应有的“正确”方法,我把正确二字加上引号,因为没有绝对的正确,因人而异,因 ...