<div id="app" >
    <h1>当前计数：{{counter}}</h1>
    <!--绑定单击事件 -->
    <button v-on:click="add">+</button>
    <button v-on:click="sub">-</button>
    <!-- 语法糖：简写：@click是v-on:click的简写，也称语法糖，意味：简单，给一些甜头 --》
    <!-- <button @click="add">+</botton> -->
</div>
<script src="./js/vue.js"></script>
<script>
    const app = new Vue({
        el: "#app", //用户挂载要管理的元素 
        data:{ //定义数据
            counter: 0
        //用户定义vue对象中的方法
        methods: {
            add: function(){
                console.log("add执行");
                this.counter++;
            sub: function(){
                console.log("sub执行");
                this.counter--;
</script>
</body>
                    一、vue定义变量let：定义常量const：定义变量二、vue循环 v-for&lt;div id="app" &gt;   &lt;ul&gt;   	&lt;li v-for="name in names"&gt;&lt;/li&gt;   &lt;/ul&gt;&lt;/div&gt;&lt;script src="./js/vue.js"&gt;&lt;/script&gt;&lt;script&gt;    const app = new Vue({        e
				
v-for 指令需要使用 item in items 形式的特殊语法，其中 items 是源数据数组，而 item 则是被迭代的数组元素的别名。
v-for的关键词in可以用of来替代
v-for循环数组
<ul id="example-1">
  <li v-for="item in items">
    {{ item.message }}
  </li&g...
				
Vue如何修改v-for循环中数据对应的值举个例子，在开发中你获取到的数组中的性别数据是英文的male 和 female，而要求是用中文显示可以使用计算属性或过滤器方法功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入
举个例子，在开
正确写法：v-for = 'book in booklist'
2.book 代表的含义
循环 booklist 数组时，定义了一个名为 book 的变量，每次循环都将数组中的每个元素依次赋值给 book 变量。所以使用 v-for 后的结果时，插值表达式 {{}}内的值应该写 book这个变量。变量是不需要带双引号的。
3.v-for 后如果需要获取下标 index，则需要传入两个参数，两个参数的写法
当在使用v-for循环生成一个带表单的标签块,表单需要进行双向绑定时
如果直接在items数组中的对象属性VM赋值给v-model实现数据的双向绑定
v-model="obj.name" //这样的效果
我一开时的做法是这样的（错误）：
        <input
        v-for="(item,index) in items"
        :key="index"
        :type="item.type"
        :placehol
在 {} 内用 [] 括起变量
<div v-for="item in videoList" :key="item.index">
      <live_video :class="{[item.itemKey]: !isExpand,}">
   </live_video>
				
开发中碰到的需求如下：如何实现？参考vue官方文档，没有找到。文档针对class的对象语法是在明确属性名的情况下，通过true or false动态显示class名，class名是固定的，针对class的数组语法虽然class名是动态的，但不适用v-for循环。而本例是在v-for循环中实现class名动态（赋变量值）。代码如下：&lt;template&gt;
	&lt;div class="q...
				
在Vue3.2中，我们可以使用v-for指令来动态渲染列表。v-for指令可以遍历一个数组或对象，然后根据遍历结果生成相应的DOM元素。我们可以使用v-for指令的语法来指定遍历的数据源，以及如何渲染每个元素。例如，我们可以使用以下代码来遍历一个数组，并将每个元素渲染为一个li元素：
  <li v-for="item in items" :key="item.id">{{ item.name }}</li>
在上面的代码中，我们使用v-for指令来遍历一个名为items的数组。我们还使用:key指令来指定每个元素的唯一标识符，以便Vue可以更高效地更新DOM。最后，我们在li元素中使用了双括号语法来显示每个元素的名称。