天天看点

vue3

挂载#app

vue3

   问题一:在箭头函数中不绑定this,函数调用this为window,(bind绑定不修改原函数,返回一个新函数)

下载源码:第一节课1:56:00   未懂第二节课43分钟

 ​​snippet generator (snippet-generator.app)​​生成代码片段的网站

  v-once用于指定元素或者组件只渲染一次:

    当数据发生变化时,元素或者组件以及其所有的子元素将视为静态内容并且跳过;

    该指令可以用于性能优化; (只在第一个加载时渲染,后续操作不改变v-once组件的元素)

vue3

很少用 v-test

vue3

 v-pre:不渲染这个标签,显示最原始的值

v-bind:动态绑定

动态绑定属性:v-bind

v-on绑定事件:

v-on参数传递

v-on修饰符

vue3
vue3

 template与v-if结合使用:

vue3

v-for遍历

 template和v-for结合使用

 计算属性computed:本质上是有缓存的,当我们多次使用计算属性时,计算属性的运算只会执行一次。

计算属性的实现原理:

计算属性的setter和getter: 直接调用为getter方法,

 计算属性的setter:

 侦听器watch:跟键值对

vue3

 默认情况下侦听器只会侦听数据本身的改变(内部发生的变化是不能侦听的)

 监听数组中对象的属性,在子组件中监听 20分钟时讲

对象的浅拷贝:只对低层次的键值对进行拷贝,对对象内的对象还是保存相同的引用地址

vue3

对象的深拷贝: 先将info借助JSON转换成字符串 JSON.stringify(info) ,然后将生成的字符串还原 JSON.parse(JSON.stringify(info)) ,从而生成一个新的对象,JSON不能拷贝undefine、function、RegExp

v-model:在input、textarea、select中创建双向绑定

vue3
vue3
vue3

首尾

注册全局组件:

    <template id="my-app">

      <component-a></component-a>

    </template>

 注册局部组件: