前端Vue练习

选择喜欢的 目标: 用户选择栏目，把用户选中的栏目信息的下面列表显示出来 提示: vue变量是数组类型，绑定在checkbox标签上 1.渲染内容 设置key唯一值 代码: 解释如下: 使用“v-fo

逛水果店 本店收银系统采用vue开发，冲这点，你不来买点试试？ 提示: v-model="变量" 输入框的值会绑定给vue的这个变量(别忘了在data里先声明) 将固定的数据渲染成动态数据 输入框 v

购物车 目标 完成商品浏览和删除功能，当无数据给用户提示 需求1 根据给的初识数据，把购物车页面渲染出来 需求2 点击对应删除按钮，删除对应数据 需求3 当数据没有了，显示一条提示消息 1 内容框遍历

加加减减案例 目标:点击生成按钮，新增一个li(随机数字)和删除按钮， 点击删除按钮，删除对应的li和值 提示:数组渲染列表。生成和删除和围绕数组操作 1 渲染当前内容框的数据 2 修改内容框的数据

帅哥美女走一走案例 目标: 点击按钮，改变3个li的顺序，在头上的就到末尾 提示 操作数组里的顺序，v-for就会重新渲染li 无序 ul 1 遍历数组数据 v-for 遍历 key="item"给于

折叠面板 目标 点击展开或收起时，把内容区域显示或隐藏 1 给按钮添加点击事件 @click="ishow = !ishow"> 2 给内容添加显示或隐藏的类名 v-show="ishow " 3 给

翻转世界 目标 点击按钮-把文字取反显示-再点击取反显示(回来) 提示: 把字符串取反赋予回去 1 按钮添加点击事件 2 new 出 Vue实例对象  data传入数据 3 this 点击后进行 拆分

点击说笑话案例 点击说笑话笔记 功能 点击按钮 随机提取一个笑话字符串 赋予给word变量 mark js 返回长度范围内的索引: Math.floor(Math.random() * this.jo