zoukankan      html  css  js  c++  java
  • Vue模板语法——数据绑定指令

    一、数据绑定指令

    1. v-text 填充纯文本

      相比插值表达式更加简洁

    2. v-html 填充HTML片段

      • 存在安全问题
      • 本网站内部数据可以使用,来自第三方的数据不可以用
    3. v-pre 填充原始信息

      显示原始信息,跳过编译过程(分析编译过程)


    二、v-text 填充纯文本

    1. v-text用法

      在需填充的标签中添加v-text指令

    2. 例如

          <div id='app'>
            <div v-text="msg"></div>
          </div>
          <script type="text/javascript" src="js/vue.js"></script>
          <script type="text/javascript">
             new Vue({
                   el:'#app',
                   data:{
                      msg:'HelloWorld'
                   }
             })
          </script>
    

    结果:HelloWorld

    三、v-html 填充HTML片段

    1. v-html用法

      在需填充的标签中添加v-html指令

    2. 例如

          <div id='app'>
            <div v-html="msg"></div>
          </div>
          <script type="text/javascript" src="js/vue.js"></script>
          <script type="text/javascript">
             new Vue({
                   el:'#app',
                   data:{
                      msg:'<h1>HelloWorld</h1>'
                   }
             })
          </script>
    

    结果:

    HelloWorld

    四、v-pre 填充原始信息

    1. v-pre用法

      在需填充的标签中添加v-pre指令

    2. 例如

          <div id='app'>
            <div v-pre>{{msg}}</div>
          </div>
          <script type="text/javascript" src="js/vue.js"></script>
          <script type="text/javascript">
             new Vue({
                   el:'#app',
                   data:{
                      msg:'<h1>HelloWorld</h1>'
                   }
             })
          </script>
    

    结果:
    {{msg}}

  • 相关阅读:
    flask 中的request
    悲观锁、乐观锁、行级锁、表级锁
    python标准库--functools.partial
    Django Model._meta API
    python中的urlencode与urldecode
    Django模版语言inclusion_tag的用法。
    Django的URL别名
    Django之模板语言
    django-request对象
    Java 基础
  • 原文地址:https://www.cnblogs.com/fpgz99810/p/12463678.html
Copyright © 2011-2022 走看看