VUE3.0
文章平均质量分 86
Clience01
这个作者很懒,什么都没留下…
展开
-
Vue3.0学习笔记(2021-11-15)01
Vue3监听属性 watch会实时监听数据变化并改变自身的值<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-sc原创 2021-11-15 17:27:21 · 605 阅读 · 0 评论 -
Vue3.0笔记(2021-11-12)01
Vue3 组件可以扩展HTML元素,封装可重复的代码组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的界面都可以抽象为一个组件树将Vue应用挂载到,应该传入#app:const RootComponent={/*选项*/}const app=Vue.createApp(RootComponent)const vm=app.mount('#app')全局组件注册一个全局组件的语法格式 const app=Vue.createApp({....}} app原创 2021-11-12 16:04:25 · 1675 阅读 · 0 评论 -
VUE 3 笔记(2021-11-11)
条件语句1.v-if,v-else2.v-if,v-else-ifexample1:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-widt原创 2021-11-11 18:15:26 · 444 阅读 · 0 评论 -
vue3学习案例
一个ToolList案例App.vue中<template> <img alt="Vue logo" src="./assets/logo.png" /> <!-- <HelloWorld msg="Hello Vue 3.0 + Vite" /> --> <Todos></Todos> </template><script>import HelloWorld from './compo原创 2021-11-04 14:55:17 · 748 阅读 · 0 评论 -
VUE3.0笔记2
Global API改为应用程序实例调用vue2中有很多全局api可以改变vue的行为,比如vue.compenent等。这导致一些问题:vue2中没有app概念,new Vue()得到的根实例被作为app,这样的话所有创建的根实例是共享相同的全局配置,这在测试时会污染其他测试用例,导致测试变得困难。全局配置也导致没有办法再单页面创建不同全局配置的多个app实例。vue3中使用createApp返回app实例,由它暴露一些列全局apimain.jscreateApp(App).compon原创 2021-11-04 14:47:57 · 314 阅读 · 0 评论 -
VUE3.0开始笔记
快速开始方式一:CDN<script src="http://cdn.bootcdn.net/ajax/libs/vue/3.0.0-rc.7/vue.global.js"></script>方式二:vue-cli升级vue-cli v4.5npm i -g @vue/cli@next方式三:vite使用vite体验更快速$ npm init vite-app <project-name>$ cd <project-name>$ npm原创 2021-10-27 17:35:03 · 121 阅读 · 0 评论 -
Vue3笔记(2021-11-10)
1.mount使用mount(‘hello-vue’)将Vue应用HelloVueApp挂载到 <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-原创 2021-11-10 16:56:34 · 1608 阅读 · 0 评论 -
2021-11-05
一个ToolList案例上一个例子组件化抽取EditTodo<template> <input type="text" :value="modelValue" @input="onInputChange" v-bind="$attrs" /></template><script>export default { // 属性声明 props: { m原创 2021-11-05 14:28:08 · 122 阅读 · 0 评论