zoukankan      html  css  js  c++  java
  • vue教程1-07 模板和过滤器

    vue教程1-07 模板和过滤器

    一、模板

    {{msg}} 数据更新模板变化

    {{*msg}} 数据只绑定一次

    {{{msg}}} HTML转意输出

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
        </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}}}
        </div>
    </body>
    </html>

    二、过滤器

    过滤器:-> 过滤模板数据
    系统提供一些过滤器:

    {{msg| filterA}}
    {{msg| filterA | filterB}}

    uppercase    eg: {{'welcome'| uppercase}}
    lowercase
    capitalize  首字母大写

    currency 钱

    {{msg| filterA 参数}}

    {{'welcome'|uppercase}}    //WELCOME
    
    {{'WELCOME'|lowercase}}   //welcome
    
    {{'WELCOME'|lowercase|capitalize}}   //Welcome
    
    {{12|currency}}  //$12.00
    
    {{12|currency '¥'}}  //¥12.00
  • 相关阅读:
    Construction构造函数
    映射验证
    映射设置
    条件映射
    映射前和映射后的操作
    AutoMapper 5.0-升级指南
    Bootstrap Tree View
    MiniProfiler使用笔记
    关于添加数据自定义编号格式问题
    【Postgresql】数据库函数
  • 原文地址:https://www.cnblogs.com/baiyangyuanzi/p/6767452.html
Copyright © 2011-2022 走看看