vue3
vue3
KAGHQ
这个作者很懒,什么都没留下…
展开
-
vscode中设置setup语法糖代码片段
【代码】vscode中设置setup语法糖代码片段。原创 2023-12-21 10:55:28 · 424 阅读 · 0 评论 -
vue3+ant-design-vue 中customRender使用
【代码】vue3+ant-design-vue 中customRender使用。原创 2023-12-20 10:10:39 · 950 阅读 · 0 评论 -
在 Vue 3 中, defineProps 定义的 props 默认是响应式的
在 Vue 3 中, defineProps 定义的 props 默认是响应式的,因此,当在子组件中使用时,无需进行任何特殊的操作。原创 2023-06-21 16:16:06 · 1485 阅读 · 0 评论 -
vue3中的watch和watchEffect
两种写法的区别是:watch 需要你明确指定依赖的变量,才能做到监听效果。而 watchEffect 会根据你使用的变量,自动的实现监听效果。原创 2023-05-31 09:54:40 · 52 阅读 · 0 评论 -
vue中的transition学习
传入的class会默认覆盖阶段的class类名,这种在使用第三方库Animation.css的时候很有用原创 2022-11-23 21:59:13 · 1116 阅读 · 0 评论 -
手写一个简单的eventBus
本篇文章实现了一个较为简单的EventBus,但是也基本满足我们在项目中的使用了。想要实现EventBus,我们首要理解的就是发布订阅模式,然后我们在思考下面几个问题,基本上就能实现一个属于自己的EventBus了。想明白了上面的问题那么EventBus我相信你也明白了,能够自己实现了。$on和$emit主要担任的是什么角色?如何给每个订阅事件添加唯一标识?如何正确删除存储的订阅事件?$emit发布事件可以传参。使用$emit发布事件。实现$once执行一次。实现$off取消订阅。什么时发布订阅模式?转载 2022-10-16 16:13:09 · 120 阅读 · 0 评论 -
vite构建的vue3项目中使用less
【代码】vite中使用less。转载 2022-11-24 11:20:27 · 1040 阅读 · 0 评论 -
vue3中setup使用组合式函数提取分页逻辑(简单示例)
后台返回的data数据。原创 2022-11-22 16:02:19 · 551 阅读 · 0 评论 -
npm在 macOS 和 Linux 上无需 sudo 即可全局安装软件包
https://github.com/sindresorhus/guides/blob/main/npm-global-without-sudo.md原创 2022-11-18 15:20:20 · 504 阅读 · 0 评论 -
vue3中 inject provide的响应式使用
代码】vue3中 inject provide的响应式使用。原创 2022-08-09 16:04:55 · 1263 阅读 · 0 评论 -
vue3中结合component :is使用tabs切换组件
代码】vue3中结合componentis使用tabs切换组件。原创 2022-07-27 22:36:20 · 2508 阅读 · 0 评论 -
vue3全局代码片段
代码】vue3全局代码片段。原创 2022-07-25 20:44:26 · 1994 阅读 · 0 评论 -
vue项目设置路径别名
方式1:let path = require("path");function resolve(dir) { return path.join(__dirname, dir);}module.exports = { chainWebpack: (config) => { config.resolve.alias.set("@", resolve("src")); },};方式2:let path = require("path");function resolve原创 2022-05-06 10:32:21 · 607 阅读 · 0 评论 -
创建一个简单的vue3项目
参考:https://cli.vuejs.org/zh/guide/creating-a-project.html创建一个简单的vue3项目为了方便我直接用的vue ui1.命令行输入2.创建一个新的项目3.可以使用默认的预设一般是根据项目手动配置4.根据自己项目选择配置(是否需要ts)5.配置6.找到自己刚刚配置的文件在vscode或者其他编译器中打开以为我刚刚选择的包管理器是yarn运行...原创 2022-04-27 16:09:46 · 377 阅读 · 0 评论 -
Pinia简单使用1
1.首先安装yarn add pinia2.在 src/main.ts 下定义引用 pinia 插件:import { createPinia } from 'pinia'createApp(App).use(createPinia()).mount('#app')3.在src下面新建store文件新建info.tsimport { defineStore } from 'pinia'export const infoStore = defineStore('info',{ sta原创 2022-01-21 14:52:57 · 598 阅读 · 0 评论 -
计一次expandedRowRender
<a-table v-if="!isLoading" ref="sTable" :columns="columns" :defaultExpandedRowKeys="defaultExpandedRowKeys" :data-source="gradeData" :pagination="false" :expandIcon="(pr原创 2021-10-13 22:18:22 · 364 阅读 · 0 评论 -
vue3中hooks使用
简单理解就是导出函数将返回的属性或者函数结构出来userCount.tsimport { ref, Ref, computed } from 'vue'type countResultObj = { count: Ref<number> increase: (increaseCount?: number) => void decrease: (decreaseCount?: number) => void}// 返回的类型是countResultObj中的类型原创 2021-10-09 19:06:37 · 1795 阅读 · 0 评论 -
vue3中提取功能函数要注意模块范围
one.tsexport const one = () => { console.log('8888')}import { one } from './文件夹位置'export default { setup () { const three = () => { two() } return { three } }}const two = () => { one()}具体参照https://www.icode9.com/con原创 2021-09-20 08:56:43 · 91 阅读 · 0 评论 -
ts报错类型“NodeRequire”上不存在属性“context”
yarn add @types/webpack-env -D原创 2021-08-23 14:27:11 · 7364 阅读 · 0 评论 -
Vue3总结- Composition API-vue3与vue2差异
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录前言一、Vue2 与 Vue3 的差异1.全局API1.use2.component & directive3.provide & inject二、Composition APIreactiverefwatchEffect三、高级响应式系统API1.customRefmarkRawshallowReactiveshallowReadonlyshallowReftoRaw前言转载:https://blog.cs.转载 2021-08-16 23:34:42 · 573 阅读 · 0 评论 -
vue3使用函数创建组件,视频学习
方法1创建自己想要添加的元素message.vue<template> <div class="grand-message"> <h3>{{ n }}</h3> <h3>{{ m }}</h3> <h1>{{ color }}</h1> </div></template><script lang="ts">import { ref原创 2021-08-13 23:33:11 · 295 阅读 · 0 评论