<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>智能社——http://www.zhinengshe.com</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <meta name="apple-mobile-web-app-capable" content="yes">

    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <style>

        .red{

            color: red;

        }

        .blue{

            background: blue;

        }

    </style>

    <script src="vue.js"></script>

    <script>

        window.onload=function(){

            new Vue({

                el:'#box',

                data:{

                    msg:'abc'

                }

            });

        };

    </script>

</head>

<body>

    <div id="box">

        <input type="text" v-model="msg">

        <br>

        {{msg}}

        <br>

        {{*msg}}   //后面更新不更新

        <br>

        {{{msg}}}   //解析html<h1></h1>

    </div>

</body>

</html>
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>智能社——http://www.zhinengshe.com</title>

    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

    <meta name="apple-mobile-web-app-capable" content="yes">

    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <style>

        .red{

            color: red;

        }

        .blue{

            background: blue;

        }

    </style>

    <script src="vue.js"></script>

    <script>

        window.onload=function(){

            new Vue({

                el:'#box',

                data:{

                }

            });

        };

    </script>

</head>

<body>

    <div id="box">

        {{'welcome'|uppercase}}  //转大写过滤器

                <br>

        {{'WELCOME'|lowercase}}

        {{'WELCOME'|lowercase|capitalize}}   //首字母大写过滤器

        {{12|currency '￥'}}  //￥12.00

        {{12|currency}}  // $12.00

    </div>

</body>

</html>

vue5 过滤器 模版的更多相关文章

  1. 63、django之模版层（template）

    上篇主要介绍了django的MTV模型,主要介绍了视图层之路由配置系统url分发和视图层之视图函数view,本篇主要讲解MTV模型中的模版层template. 模版层(template) 一.模版简介 ...

  2. django之模版层（template）

    上篇主要介绍了django的MTV模型,主要介绍了视图层之路由配置系统url分发和视图层之视图函数view,本篇主要讲解MTV模型中的模版层template. 本篇导论: 模版简介 模版之变量 模版之 ...

  3. 5 JInja2模版（适用于Django和Flask）

    模版 在生产环节下,我们要把后端程序(其实就是python)计算出来的数据和html页面结合起来做,这个时候模版就派上大用处了. Flask下的模版---Jinja2 Jinja是日本寺庙的意思,并且 ...

  4. django-CBV刨析、模板层

    今日内容概要 CBV源码剖析 模版层 模版语法传值 模版语法之过滤器 模版语法之标签 自定义过滤器.标签及inclusion_tag 模版的继承 模版的导入 FBV与CBV ""& ...

  5. Django学习day05随堂笔记

    每日测验 """ 今日考题 1.反向解析的本质是什么,无名和有名反向解析如何操作? 2..路由分发能够实现的前提是什么,需要注意什么,名称空间什么时候使用 3..什么是虚 ...

  6. ansible基础-Jinja2模版 | 过滤器

    Jinja2模版介绍 注:本文demo使用ansible2.7稳定版 在ansible基础-变量的「8.2 模版使用变量」章节中关于模版与变量也有所提及,有兴趣的同学可以去回顾一下. ansible通 ...

  7. Django 模版过滤器

    模版常用过滤器 在模版中,有时候需要对一些数据进行处理以后才能使用.一般在Python中我们是通过函数的形式来完成的.而在模版中,则是通过过滤器来实现的.过滤器使用的是|来使用.比如使用add过滤器, ...

  8. Django内置模版过滤器

    Django内置过滤器总览 可以查询下表来总览Django的内置过滤器: 过滤器 说明 add 加法 addslashes 添加斜杠 capfirst 首字母大写 center 文本居中 cut 切除 ...

  9. django系列4.1--模版系统,过滤器,标签,模版继承,组件

    django 模版系统 一. 语法 { { 变量 } } {% 表达式 %} 二. 变量 { {变量名} } 深度查询据点符( . )在模版语言中有特殊的含义. 当模版系统遇到点(.) 查询顺序如下: ...

随机推荐

  1. [洛谷P2183]巧克力

    题目大意:有n块巧克力,每块巧克力有一个大小.巧克力可以切成若干份.现在要你切成大小相等的m块,且尽可能大.求这个大小. 解题思路:我们二分巧克力切成的大小,然后计算能切成多少块,判断即可.由于最大的 ...

  2. camke 参数

    cmake -DCMAKE_INSTALL_PREFIX=/application/mysql-5.5.32 \   -DMYSQL_DATADIR=/application/mysql-5.5.32 ...

  3. 动态Axios配置

    推荐使用Vue-cli工具来创建和管理项目,就算刚开始不熟悉,用着用着便可知晓其中的奥妙.前一段时间官方所推荐的数据请求插件还是Vue-resource,但现在已经变了,变成了Axios,不用知道为什 ...

  4. 【POJ 3714】Raid

    [题目链接]:http://poj.org/problem?id=3714 [题意] 给你两类的点; 各n个; 然后让你求出2*n个点中的最近点对的距离; 这里的距离定义为不同类型的点之间的距离; [ ...

  5. [Mobx] Using mobx to isolate a React component state

    React is great for diffing between Virtual-DOM and rendering it to the dom. It also offers a naïve s ...

  6. leetCode解题报告5道题(七)

    题目一:Interleaving String Given s1, s2, s3, find whether s3 is formed by the interleaving of s1 and s2 ...

  7. 安卓操作sqlite3，增删改查

    创建 layout <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:an ...

  8. es6 --- 功能

    标记的模板文字 1.模板文字!确实很棒.我们不再会这样做…. const concatenatedString = "I am the " + number + "per ...

  9. 【DotNetNuke介绍】

    简介 DotNetNuke(以下简称DNN)的最终目的是创建一个门户的框架平台,这个平台可以为开发者增添模块搭建应用程序提供坚实的可靠的支持.应用程序的一个关键的功能就是数据存取..NET Frame ...

  10. 【DNN 系列】 模块开发 8.0.1

    1.创建第一个模块需要准备的东西有 https://github.com/dnnsoftware/DNN.Templates/releases/tag/1.0.1 VS 2015 插件 创建一个项目M ...