11 2021 档案
摘要：
刚开始使用 script setup 语法糖的时候，编辑器会提示这是一个实验属性，要使用的话，需要固定 vue 版本。 在 6 月底，该提案被正式定稿，在 v3.1.3 的版本上，继续使用但仍会有实验性提案的提示，在 V3.2 中，才会去除提示并移除一些废弃的 API。 script setup 是
阅读全文
刚开始使用 script setup 语法糖的时候，编辑器会提示这是一个实验属性，要使用的话，需要固定 vue 版本。 在 6 月底，该提案被正式定稿，在 v3.1.3 的版本上，继续使用但仍会有实验性提案的提示，在 V3.2 中，才会去除提示并移除一些废弃的 API。 script setup 是
阅读全文
摘要：
在父子组件传递数据时，通常使用的是 props 和 emit，父传子时，使用的是 props，如果是父组件传孙组件时，就需要先传给子组件，子组件再传给孙组件，如果多个子组件或多个孙组件使用时，就需要传很多次，会很麻烦。 像这种情况，可以使用 provide 和 inject 解决这种问题，不论组件嵌
阅读全文
在父子组件传递数据时，通常使用的是 props 和 emit，父传子时，使用的是 props，如果是父组件传孙组件时，就需要先传给子组件，子组件再传给孙组件，如果多个子组件或多个孙组件使用时，就需要传很多次，会很麻烦。 像这种情况，可以使用 provide 和 inject 解决这种问题，不论组件嵌
阅读全文
摘要：
vue3 中 的 computed 的使用，由于 vue3 兼容 vue2 的选项式API，所以可以直接使用 vue2的写法，这篇文章主要介绍 vue3 中 computed 的新用法，对比 vue2 中的写法，让您快速掌握 vue3 中 computed 的新用法。 组合式 API 中使用 com
阅读全文
vue3 中 的 computed 的使用，由于 vue3 兼容 vue2 的选项式API，所以可以直接使用 vue2的写法，这篇文章主要介绍 vue3 中 computed 的新用法，对比 vue2 中的写法，让您快速掌握 vue3 中 computed 的新用法。 组合式 API 中使用 com
阅读全文
摘要：
选项式API与之前写法相同，本篇文章主要通过 Options API 和 Composition API 对比 watch 的使用方法，让您快速掌握 vue3 中 watch 新用法。建议收藏！ 一、watch 新用法 选项式API中，watch 使用 watch:{ mood(curVal,pre
阅读全文
选项式API与之前写法相同，本篇文章主要通过 Options API 和 Composition API 对比 watch 的使用方法，让您快速掌握 vue3 中 watch 新用法。建议收藏！ 一、watch 新用法 选项式API中，watch 使用 watch:{ mood(curVal,pre
阅读全文
摘要：问题描述： 升级脚手架 vue-cli 4.5.15 版本之后，使用 template 时报错： [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available.
阅读全文
摘要：
在之前 vue2 中，data 返回的数据，可以直接进行双向绑定使用，如果我们把 setup 中数据类型直接双向绑定，发现变量并不能实时响应。接下来就看看setup如何实现data的响应式功能？
阅读全文
在之前 vue2 中，data 返回的数据，可以直接进行双向绑定使用，如果我们把 setup 中数据类型直接双向绑定，发现变量并不能实时响应。接下来就看看setup如何实现data的响应式功能？
阅读全文
摘要：
本篇文章干货较多，建议收藏！ 从 vue2 升级到 vue3，vue3 是可以兼容 vue2 的，所以 vue3 可以采用 vue2 的选项式API。由于选项式API一个变量存在于多处，如果出现问题时，就需要去多个函数内检查，项目较大时，遇到问题，增加排故的难度。所以 vue3 中新增了 setup
阅读全文
本篇文章干货较多，建议收藏！ 从 vue2 升级到 vue3，vue3 是可以兼容 vue2 的，所以 vue3 可以采用 vue2 的选项式API。由于选项式API一个变量存在于多处，如果出现问题时，就需要去多个函数内检查，项目较大时，遇到问题，增加排故的难度。所以 vue3 中新增了 setup
阅读全文
摘要：
自定义指令分为全局和局部两种类型，大家并不陌生。今天我们就讲讲在 vue3 中，自定义指令定义、使用以及钩子函数都有哪些变化？ 一、注册自定义指令 以下实例都是实现一个输入框自动获取焦点的自定义指令。 1.1、全局自定义指令 在vue2中，全局自定义指令通过 directive 挂载到 Vue 对象
阅读全文
自定义指令分为全局和局部两种类型，大家并不陌生。今天我们就讲讲在 vue3 中，自定义指令定义、使用以及钩子函数都有哪些变化？ 一、注册自定义指令 以下实例都是实现一个输入框自动获取焦点的自定义指令。 1.1、全局自定义指令 在vue2中，全局自定义指令通过 directive 挂载到 Vue 对象
阅读全文
摘要：
本篇文章主要目的就是想告诉我身边，正在学 vue3 或者 准备学 vue3 的同学，vue3中网络请求axios该如何使用，防止接触了一点点 vue3 的同学会有个疑问？生命周期、router 、vux使用都改变了，那 axios 使用有没有啥改变？ 小姐姐 使用 axios 之前，需要先安装好。
阅读全文
本篇文章主要目的就是想告诉我身边，正在学 vue3 或者 准备学 vue3 的同学，vue3中网络请求axios该如何使用，防止接触了一点点 vue3 的同学会有个疑问？生命周期、router 、vux使用都改变了，那 axios 使用有没有啥改变？ 小姐姐 使用 axios 之前，需要先安装好。
阅读全文
摘要：
vue 2 中采用选项式API。如：data、methods、watch、computed以及生命周期钩子函数等等。 mixin 混入，提供了一种非常灵活的方式，来分发 vue 组件中的可复用功能，一个mixin 对象可以包含任意组件选项，当组件使用 mixin 对象时，所有的 mixin 对象的选
阅读全文
vue 2 中采用选项式API。如：data、methods、watch、computed以及生命周期钩子函数等等。 mixin 混入，提供了一种非常灵活的方式，来分发 vue 组件中的可复用功能，一个mixin 对象可以包含任意组件选项，当组件使用 mixin 对象时，所有的 mixin 对象的选
阅读全文
摘要：
vuex4 是 vue3的兼容版本，提供了和vuex3 的相同API。因此我们可以在 vue3 中复用之前已存在的 vuex 代码。 一、安装以及初始化 vuex4安装： npm install vuex@next 为了向vue3初始化方式看齐，vuex4 初始化方式做了相应的变化，使用新的 cre
阅读全文
vuex4 是 vue3的兼容版本，提供了和vuex3 的相同API。因此我们可以在 vue3 中复用之前已存在的 vuex 代码。 一、安装以及初始化 vuex4安装： npm install vuex@next 为了向vue3初始化方式看齐，vuex4 初始化方式做了相应的变化，使用新的 cre
阅读全文
摘要：
虽然 vue-router 4 大多数 API 保持不变，但是在 vue3 中以插件形式存在，所以在使用时有一定的变化。接下来就学习学习它是如何使用的。 一、安装并创建实例 安装最新版本的 vue-router npm install vue-router@4 或 yarn add vue-rout
阅读全文
虽然 vue-router 4 大多数 API 保持不变，但是在 vue3 中以插件形式存在，所以在使用时有一定的变化。接下来就学习学习它是如何使用的。 一、安装并创建实例 安装最新版本的 vue-router npm install vue-router@4 或 yarn add vue-rout
阅读全文
摘要：
一、组件内的 data 为什么总是函数形式？ 我们试着先做一个计数器案例，把 data 的返回形式修改成一个对象。具体的代码如下： <template> <div> <button @click="num++">+</button> {{num}} <button @click="num--">-<
阅读全文
一、组件内的 data 为什么总是函数形式？ 我们试着先做一个计数器案例，把 data 的返回形式修改成一个对象。具体的代码如下： <template> <div> <button @click="num++">+</button> {{num}} <button @click="num--">-<
阅读全文
摘要：
一、teleport 介绍 teleport 传送门组件，提供一种简洁的方式，可以指定它里面的内容的父元素。通俗易懂地讲，就是 teleport 中的内容允许我们控制在任意的DOM中，使用简单。 使用语法： <teleport to="body"> <div> 需要创建的内容 </div> </te
阅读全文
一、teleport 介绍 teleport 传送门组件，提供一种简洁的方式，可以指定它里面的内容的父元素。通俗易懂地讲，就是 teleport 中的内容允许我们控制在任意的DOM中，使用简单。 使用语法： <teleport to="body"> <div> 需要创建的内容 </div> </te
阅读全文
摘要：
本篇文章主要介绍 v-model 在 Vue2 和 Vue3 中使用变化。 一、Vue2 中 v-model 的使用 v-model 是语法糖，本质还是父子组件间的通信。父子组件通信时有两种方式： 父给子传值：通过 props 子给父传值：通过 Events up，使用 $emit 触发事件。 1.
阅读全文
本篇文章主要介绍 v-model 在 Vue2 和 Vue3 中使用变化。 一、Vue2 中 v-model 的使用 v-model 是语法糖，本质还是父子组件间的通信。父子组件通信时有两种方式： 父给子传值：通过 props 子给父传值：通过 Events up，使用 $emit 触发事件。 1.
阅读全文
浙公网安备 33010602011771号