vueでのv-text/v-htmlの使用例コードの詳細

1982 ワード

くだらないことは言わないで、コードは以下の通りです.




  
  Vue      ,     

  

  
  

new Vue({ el:"#root", data:{ msg: "world", number:123 } })

表示123




  
  Vue      ,     

  

  

new Vue({ el:"#root", data:{ content: "<h1>hello world</h1>", } })

補足:vuejs{},v-textとv-htmlの違い

  

{{message}}

  

  

  let app = new Vue({   el: "#app",   data: {     message: "<span> </span>",     html: "<span>html </span>",     text: "<span>html </span>",   } });

違い:
{{message}}:データを純粋なテキストに解析し、本物のhtmlを出力できず、ページロード時に{}}を表示するため、通常はv-htmlとv-textで置き換えられ、カッコ方式は後でキャンセルされる可能性があります
v-html="html":本物のhtmlを出力
v-text=「text」:データを純粋なテキストに解析し、本物のhtmlを出力できず、カッコとの違いはページロード時に{{}}を表示しない
まとめ
以上述べたのは小編が皆さんに紹介したvueの中でv-text/v-htmlは実例コードを使って詳しく説明して、みんなに役に立つことを望んで、もしみんなが何か疑問があれば私に伝言を歓迎して、小編はすぐにみんなに返事します!