vue2[初级]模板语法

最新推荐文章于 2024-03-23 20:07:50 发布

ejokovic

最新推荐文章于 2024-03-23 20:07:50 发布

阅读量171

点赞数

分类专栏： VUE 文章标签： javascript vue.js 前端

本文链接：https://blog.csdn.net/u011664286/article/details/126978100

版权

Vue.js 使用了基于 HTML 的模板语法，允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML，所以能被遵循规范的浏览器和 HTML 解析器解析

模板语法包含插值，数据绑定，js表达式，简写

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>模板语法</title>
</head>
<body>

<div id="app">
    <h2>插值</h2>
    <!--
    v-model 是双向绑定属性 即文本框输入的值实时显示到下边的p标签中
    -->
    <input type="text" v-model="message"/>
    <p>{
  {message}}</p>
    <!-- v-once 只会渲染一次 -->
    <p v-once>{
  {message}}</p>
    <!-- v-html 可以将带有html标签的内容按照html格式进行展示 而不是看作是文本来展示 -->
    <p v-html="message"></p>

    <h2>特性</h2>
    <!-- 原始id赋值操作 -->
    <div id="dyncId">1</div>