插值(Interpolations) の変更点

• 追加された行はこの色です。
• 削除された行はこの色です。
• +Vue+插值(Interpolations) へ行く。
• +Vue+插值(Interpolations) の差分を削除

#author("2022-05-18T14:58:02+08:00","default:Admin","Admin")
#author("2022-05-18T14:58:50+08:00","default:Admin","Admin")
[[Vue]]

&color(red){※前提条件：本情報はVue 2.0を基づいて説明してる};

* 基本语法 [#hbb2b7ce]

双花括号语法，会将数据中的 HTML 转为纯文本后再进行插值。为了输出真正的 HTML，你需要使用 v-html 指令：

使用双花括号语法： <p>{{ rawHtml }}</p>
使用 v-html 指令： <p><span v-html="rawHtml"></span></p>
使用双花括号语法：
 <p>{{ rawHtml }}</p>

使用 v-html 指令：
 <p><span v-html="rawHtml"></span></p>

#codeprettify{{
export default {
  data () {
    return {
      rawHtml: '<span style="color:red">red</span>'
    }
  }
}
}}

* 可使用JavaScript表达式 [#j93505a8]

 {{ number + 1 }}
 {{ ok ? 'YES' : 'NO' }}
 {{ message.split('').reverse().join('') }}
 <div v-bind:id="'list-' + id"></div>

每个绑定都只能包含单个表达式，所以以下示例都无法运行：

 <!-- 这是语句，不是表达式 -->
 {{ var a = 1 }}
 
 <!-- 流控制也无法运行，请使用三元表达式 -->
 {{ if (ok) { return message } }}

#hr();
コメント：
#comment_kcaptcha