文本插值:使用双大括号 {{ }} 来绑定数据到文本节点。
<template> <div id="counter"> <!-- 组件根元素通常不需要 id,除非你需要它来进行 DOM 操作 --> <h1>Counter Example</h1> <p>{{ name }}</p> <p>{{ age }}</p> </div> </template> <script> export default { name: 'Counter', data() { return { name: 'mxx', // 假设这是一个名字,所以它应该是字符串 age: 19 // 年龄通常是数字 } } } </script> <style> /* 可以在这里添加一些样式 */ </style>
原始 HTML:使用 v-html 指令来输出原始 HTML。
属性绑定:使用 v-bind 或简写 : 来绑定 HTML 属性