随笔分类 - vue 3.x相关
vue3中自定义hooks
摘要:hook: 直译[hʊk] 钩子 Hooks在前端领域并没有明确定义,借用知乎大佬的定义:在JS里是callback,事件驱动,集成定义一些可复用的方法。 Vue3官方文档并没有对自定义Hooks做任何定义,却无处不在在使用这个技巧,很多开源项目也在用这个技巧,所以作为一个合格的Vuer学会自定义H
阅读全文
vue3.0+vite 使用 postcss-pxtorem 实现移动自适应
摘要:下载 postcss-pxtorem npm i postcss-pxtorem -D 与package.json同级目录创建postcss.config.js文件 module.exports = { plugins: { autoprefixer: { overrideBrowserslist:
阅读全文
$listeners在vue3中使用
摘要:vue2中使用$attrs从父组件传递数据给子组件嵌套组件,父组件通过通过$listeners监听子组件的事件 vue3把把$attrs和$listeners统一合并到$attrs中 v-bind="$attrs"
阅读全文
Vue3不再支持Filters过滤器
摘要:filters过滤器已从Vue 3.0中删除,不再支持。 2.x 语法在2.x中,开发人员可以使用过滤器来处理常见的文本格式。 <template> <h1>Bank Account Balance</h1> <p>{{ accountBalance | currencyUSD }}</p> </t
阅读全文
vue3.0 sync属性变化
摘要:.sync使用方法改变 一、带参数的 v-model 2.x <ChildComponent :title.sync="pageTitle" /> 3.x <ChildComponent v-model:title="pageTitle" /> 二、不带参数的 v-model 3.x <ChildC
阅读全文
Vue3不支持eventBus
摘要:$on、$off 和 $once 实例方法被删除。实例上不再实现这三个事件接口(核心就是事件触发与事件监听器功能的封装)。 2.x 语法在2.x中,Vue 实例可以用事件API($on、$off 和 $once)强制附加的处理代码逻辑。这用于创建监听器功能,以创建在整个应用程序中使用的全局事件监听器
阅读全文
Vite2 Vue3 SSR
摘要:目标:用 vite2 + vue3 + Ts 搭建一个开箱即用的最简 ssr 通用项目, 包含必要的 vuex vue-router asyncData header管理。 一 通过官方脚手架搭建一个 vue-ts 的 SPA 项目 首先安装 yarn 包管理工具: 创建一个简单的 vue-ts 项
阅读全文
vue3中使用el-form
摘要:template <el-form ref="form" :model="ruleForm" :rules="rules" label-width="120px" class="demo-ruleForm" > <el-form-item label="用户名" prop="username"> <
阅读全文
vue3中ref、reactive、toRef、toRefs区别
摘要:简单描述vue3中ref、reactive、toRef、toRefs区别 ref:ref用于创建基础数据类型的响应式变量(采用复制的方式,修改响应式数据不会影响原始数据,数据发生改变,界面就会自动更新) setup(){ const refA = ref(0) } reactive:reactive
阅读全文
几个 Vue 3 重要特性
摘要:1. <component> 组件导入语法糖 在目前的写法中,要引入其它组件,就得先在 <script> 中 import,再将其模块名放入组件的 components: {} 属性对象中。比如: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 <template> <Foo/>
阅读全文
vue3 composition api 对比 react hooks
摘要:原文:https://dev.to/voluntadpear/comparing-react-hooks-with-vue-composition-api-4b32 Vue 最近提出了 Composition API RFC,一种新的书写 Vue 组件的 API;该 API 受到 React Hoo
阅读全文
vue3 文档相关
摘要:vue3 英文版:https://v3.vuejs.org/guide/introduction.html vue3 中文版:https://v3.cn.vuejs.org/ https://vue3js.cn/ vue3源码: https://vue-js.com/learn-vue/ 对应vue
阅读全文
Vue 3.0 — One Piece 发布
摘要:Vue 团队于 2020 年 9 月 18 日晚 11 点半发布了 Vue 3.0 版本,我们连夜对 Release 进行了翻译。由于时间仓促,文中如有翻译不当的地方还望提出。如有侵权,请联系删帖。以下为译文正文。原文:https://github.com/vuejs/vue-next/releas
阅读全文
Vue3 和vue2 的响应式有什么区别,Proxy 无敌?(面试热门,源码详解)
摘要:前言 大家都知道,Vue2 里的响应式其实有点像是一个半完全体,对于对象上新增的属性无能为力,对于数组则需要拦截它的原型方法来实现响应式。 举个例子: let vm = new Vue({ data() { return { a: 1 } } }) // ❌ oops,没反应! vm.b = 2 l
阅读全文