尚硅谷vue学习记录
文章平均质量分 90
尚硅谷
fw学前端
这个作者很懒,什么都没留下…
展开
-
2.15 vue3 day01 setup ref setup的参数 prop slot插槽 自定义事件通信
官方文档: 组合式 API 常见问答 | Vue.js理解:Vue3.0中一个新的配置项,值为一个函数。setup是所有Composition API(组合API)“ 表演的舞台 ”。组件中所用到的:数据、方法等等,均要配置在setup中。setup函数的两种返回值:若返回一个对象,则对象中的属性、方法, 在模板中均可以直接使用。(重点关注!)若返回一个渲染函数:则可以自定义渲染内容。(了解)注意点:尽量不要与Vue2.x配置混用Vue2.x配置(data、methos、computed...)中可以访问到原创 2023-02-16 16:11:16 · 520 阅读 · 0 评论 -
10.29 vue day 01 初始Vue Vue模板语法 绑定方式 事件修饰符
初识Vue: 1.想让Vue工作,就必须创建一个Vue实例,且要传入一个配置对象; 2.root容器里的代码依然符合html规范,只不过混入了一些特殊的Vue语法; 3.root容器里的代码被称为【Vue模板】; 4.Vue实例和容器是一一对应的; 5.真实开发中只有一个Vue实例,并且会配合着组件一起使用; 6.原创 2022-10-30 11:57:17 · 81 阅读 · 0 评论 -
10.30 vue day02 键盘事件 计算属性computed 监视属性watch 样式绑定
②.若虚拟DOM中内容变了, 则生成新的真实DOM,随后替换掉页面中之前的真实DOM。2.所有不被Vue所管理的函数(定时器的回调函数、ajax的回调函数等、Promise的回调函数),最好写成箭头函数,key是虚拟DOM对象的标识,当数据发生变化时,Vue会根据【新数据】生成【新的虚拟DOM】,(1).配合keyup使用:按下修饰键的同时,再按下其他键,随后释放其他键,事件才被触发。3.备注:使用v-if的时,元素可能无法获取到,而使用v-show一定可以获取到。原创 2022-10-30 18:52:27 · 86 阅读 · 0 评论 -
10.31 Vue day03 监视原理,内置指令,收集表单数据
1.使用这些API:push()、pop()、shift()、unshift()、splice()、sort()、reverse()(1)v-model的初始值是非数组,那么收集的就是checked(勾选 or 未勾选,是布尔值)若:,则v-model收集的是value值,用户输入的就是value值。(2)v-model的初始值是数组,那么收集的的就是value组成的数组。(1).v-html会替换掉节点中所有的内容,{{xx}}则不会。原创 2022-10-31 20:04:39 · 76 阅读 · 0 评论 -
11.1 Vue day04 自定义指令 非单文件组件
一、定义语法:(1).局部指令:directives:{指令名:配置对象} 或 directives{指令名:回调函数}(2).全局指令:Vue.directive(指令名,配置对象) 或 Vue.directive(指令名,回调函数)二、配置对象中常用的3个回调:(1).bind:指令与元素成功绑定时调用。(2).inserted:指令所在元素被插入页面时调用。(3).update:指令所在模板结构被重新解析时调用。三、备注:原创 2022-11-01 20:54:05 · 63 阅读 · 0 评论 -
11.2 Vue day05 脚手架 ref属性 混合 插件 scoped
{....}第二步使用混入:原创 2022-11-02 20:48:13 · 77 阅读 · 0 评论 -
11.5 Vue day06 父子组件通信、自定义事件
组件化编码流程:(1).拆分静态组件:组件要按照功能点拆分,命名不要与html元素冲突。(2).实现动态组件:考虑好数据的存放位置,数据是一个组件在用,还是一些组件在用:1).一个组件在用:放在组件自身即可。2). 一些组件在用:放在他们共同的父组件上(状态提升)。(3).实现交互:从绑定事件开始。props适用于:(1).父组件 ==> 子组件 通信(2).子组件 ==> 父组件 通信(要求父先给子一个函数)原创 2022-11-06 13:47:18 · 283 阅读 · 1 评论 -
11.6 Vue day07 全局事件总线 消息订阅与发布
2.School组件挂载后,给this.$bus绑定hello事件,注意回调函数使用箭头(如果先定义函数的话,再调用记得加this)3.Student组件中 1)给按钮绑定事件 2)定义回调函数并触发this.$bus的”hello“事件。接收数据:A组件想接收数据,则在A组件中给$bus绑定自定义事件,事件的回调留在A组件自身。需求:在Student的组件点击按钮,可以在School组件使用。接收数据:A组件想接收数据,则在A组件中订阅消息,订阅的回调留在A组件自身。一种组件间通信的方式,适用于。原创 2022-11-07 13:43:02 · 214 阅读 · 0 评论 -
11.7 Vue day08 Vue封装的过度与动画 Vue脚手架配置解决跨域访问
工作方式:若按照上述配置代理,当请求了前端不存在的资源时,那么该请求会转发给服务器 (优先匹配前端资源)target: 'http://localhost:5000',// 代理目标的基础路径。target: 'http://localhost:5001',// 代理目标的基础路径。'/api1': {// 匹配所有以 '/api1'开头的请求路径。'/api2': {// 匹配所有以 '/api2'开头的请求路径。2) 定义transition的name。3)添加进入的时候的类名和退出的时候的类名。原创 2022-11-08 13:07:37 · 68 阅读 · 0 评论 -
11.9 Vue day09 插槽 Vuex搭建 store配置项
标签。插槽默认内容...插槽默认内容...插槽默认内容...原创 2022-11-10 12:16:13 · 112 阅读 · 0 评论 -
11.10 Vue day10 Vuex四个map方法 mapMutations Vuex模块化 路由的query参数 多级路由
path:'message',//此处一定不要写:/message。//借助mapState生成计算属性:sum、school、subject(对象写法)//借助mapState生成计算属性:sum、school、subject(数组写法)path:'news', //此处一定不要写:/news。//借助mapGetters生成计算属性:bigSum(对象写法)//借助mapGetters生成计算属性:bigSum(数组写法)原创 2022-11-11 12:16:50 · 283 阅读 · 0 评论 -
11.11 Vue day11 路由命名 路由守卫 路由的params参数
/第二种写法:props值为布尔值,布尔值为true,则把路由收到的所有params参数通过props传给Detail组件。跳转//第一种写法:props值为对象,该对象中所有的key-value的组合最终都会通过props传给Detail组件。跳转原创 2022-11-11 19:58:05 · 138 阅读 · 0 评论