摘要: 特点: 快速冷启动 即时的热模块更新 真正的按需编译 Vite,一个基于浏览器原生 ES imports 的开发服务器。利用浏览器去解析 imports,在服务器端按需编译返回,完全跳过了打包这个概念,服务器随起随用。同时不仅有 Vue 文件支持,还搞定了热更新,而且热更新的速度不会随着模块增多而变 阅读全文
posted @ 2022-02-08 14:15 `Duet` 阅读(223) 评论(0) 推荐(0) 编辑
摘要: vue程序会创建一个【vue应用的实例(对象)】 <div id="app"> <h1>{{msg}}</h1> <button @click="check">按钮</button> </div> <script src="https://unpkg.com/vue@next"></script> 阅读全文
posted @ 2021-08-01 17:18 `Duet` 阅读(228) 评论(0) 推荐(0) 编辑
摘要: 如何定义一个组件 引入一个component <div id="app"> <hello></hello> </div> <script src="https://unpkg.com/vue@next"></script> <script> const app = Vue.createApp({ d 阅读全文
posted @ 2021-08-01 12:05 `Duet` 阅读(107) 评论(0) 推荐(0) 编辑
摘要: 实现一个简单的水果购物车功能 需要用到的指令 v-for遍历数据列表 v-on绑定提交的事件 绑定加减水果数量的事件 v-model双向绑定输入框的数据 除此之外需要用到computed计算属性来自动计算总价 <div id="app"> <h1>水果列表</h1> <form action="" 阅读全文
posted @ 2021-07-31 17:54 `Duet` 阅读(503) 评论(0) 推荐(0) 编辑
摘要: 双向数据绑定 提交表单引入一个很实用的指令 v-model <div id="app"> <h1>{{msg}}</h1> <form action="" @submit.prevent="post"> <input type="text" v-model="msg"> <button>提交表单</ 阅读全文
posted @ 2021-07-30 20:24 `Duet` 阅读(2123) 评论(1) 推荐(0) 编辑
摘要: 实现一个点击按钮切换图片的效果 <div id="app"> <img :src="src" alt=""> <button @click=change(0)>1</button> <button @click=change(1)>2</button> <button @click=change(2 阅读全文
posted @ 2021-07-30 11:50 `Duet` 阅读(596) 评论(0) 推荐(0) 编辑
摘要: 首先三个常用的指令,和vue2一样 v-text 简写为 {{}} v-bind 简写为 : v-on 简写为 @ <div id="app"> <!-- 指令:vue提供的一些特殊的属性v-开头 --> <h1 v-bind:title="tit" v-text="msg" v-on:click= 阅读全文
posted @ 2021-07-29 22:14 `Duet` 阅读(186) 评论(0) 推荐(0) 编辑
摘要: <div id="app"> <h1>{{msg}}</h1> </div> <script src="https://unpkg.com/vue@next"></script> <script> // vue2 new Vue({el:}) // vue2 使用el 挂载 // vue2 用这种简 阅读全文
posted @ 2021-07-29 21:42 `Duet` 阅读(58) 评论(0) 推荐(0) 编辑
摘要: 首先建立一个对象 const student = { name: "小明", age: 12, [Symbol("level")]: "优秀", [Symbol("level")]: "有钱" } 通过Object.getOwnPropertyDescriptor获取属性值并输出 const val 阅读全文
posted @ 2021-07-29 18:15 `Duet` 阅读(57) 评论(0) 推荐(0) 编辑
摘要: Symbol的作用 Symbol.interator Symbol.iterator是一个内置的值 const student = { name: "小明", age: 12, [Symbol("level")]: "优秀", [Symbol("level")]: "有钱" } const list 阅读全文
posted @ 2021-07-29 17:53 `Duet` 阅读(117) 评论(0) 推荐(0) 编辑