随笔分类 - Vue3
摘要：特点： 快速冷启动 即时的热模块更新 真正的按需编译 Vite，一个基于浏览器原生 ES imports 的开发服务器。利用浏览器去解析 imports，在服务器端按需编译返回，完全跳过了打包这个概念，服务器随起随用。同时不仅有 Vue 文件支持，还搞定了热更新，而且热更新的速度不会随着模块增多而变
阅读全文
摘要：vue程序会创建一个【vue应用的实例（对象）】 <div id="app"> <h1>{{msg}}</h1> <button @click="check">按钮</button> </div> <script src="https://unpkg.com/vue@next"></script>
阅读全文
摘要：如何定义一个组件 引入一个component <div id="app"> <hello></hello> </div> <script src="https://unpkg.com/vue@next"></script> <script> const app = Vue.createApp({ d
阅读全文
摘要：实现一个简单的水果购物车功能 需要用到的指令 v-for遍历数据列表 v-on绑定提交的事件 绑定加减水果数量的事件 v-model双向绑定输入框的数据 除此之外需要用到computed计算属性来自动计算总价 <div id="app"> <h1>水果列表</h1> <form action=""
阅读全文
摘要：双向数据绑定 提交表单引入一个很实用的指令 v-model <div id="app"> <h1>{{msg}}</h1> <form action="" @submit.prevent="post"> <input type="text" v-model="msg"> <button>提交表单</
阅读全文
摘要：实现一个点击按钮切换图片的效果 <div id="app"> <img :src="src" alt=""> <button @click=change(0)>1</button> <button @click=change(1)>2</button> <button @click=change(2
阅读全文
摘要：首先三个常用的指令，和vue2一样 v-text 简写为 {{}} v-bind 简写为 ： v-on 简写为 @ <div id="app"> <!-- 指令：vue提供的一些特殊的属性v-开头 --> <h1 v-bind:title="tit" v-text="msg" v-on:click=
阅读全文
摘要：<div id="app"> <h1>{{msg}}</h1> </div> <script src="https://unpkg.com/vue@next"></script> <script> // vue2 new Vue({el:}) // vue2 使用el 挂载 // vue2 用这种简
阅读全文
浙公网安备 33010602011771号