随笔分类 - Vue3
1
摘要：EasyPlayer.vue <template> <div> <div class="easy-player" > <div class="ant-modal-mask"></div> <div class="modal-content"> <div class="box-title" :titl
阅读全文
摘要：相关依赖 "typeit": "^8.8.3", "vue3-markdown-it": "^1.0.10", 示例效果 核心代码 <template> <a-modal class="modal-container" style="min-width: 1400px;" :visible="mod
阅读全文
摘要：依赖 "@vue-office/docx": "^1.3.0", "@vue-office/excel": "^1.4.5", "@vue-office/pdf": "^1.5.3", 参考： https://www.jb51.net/article/275080.htm 代码案例 核心代码 <di
阅读全文
摘要：依赖项版本 "ant-design-vue": "^3.2.20", "dayjs": "^1.11.10", "vue": "^3.0.5", 依赖处理 main.js中 import { createApp } from 'vue' import Antd from 'ant-design-vu
阅读全文
摘要：``` import ThumbnailApp from '@/assets/nlzsimg/newedition/ThumbnailApp.png'; ```
阅读全文
摘要：> 在 Vue 中，"omit" 是一个常用的操作，用于过滤或省略属性。它主要用于组件开发中，用于传递属性给子组件时选择性地排除某些属性。 当你在 Vue 组件中使用 v-bind 或 : 语法来传递属性时，你可以使用 "omit" 来排除不需要的属性。例如，假设你有一个父组件传递属性给子组件的示例
阅读全文
摘要：``` ```
阅读全文
摘要：侦听ref和reactive const state = reactive({ count: 0 }) // 侦听reactive中属性，需要包裹在箭头函数中 watch(() => state.count, (newVal, oldVal) => { }) // watch直接接受ref作为监听对
阅读全文
摘要：业务效果 核心代码 <template> <a-pagination v-model:current="current" :total="total" :pageSize="pageSize" show-less-items show-size-changer :pageSizeOptions="[
阅读全文
摘要：https://juejin.cn/post/6999687348120190983#heading-7 Vue3 通信使用写法 1. props 用 props 传数据给子组件有两种方法，如下 方法一，setup() 方法写法 // Parent.vue 传送 <child :msg1="msg1
阅读全文
摘要：参考：https://www.cnblogs.com/lovewhatIlove/p/16476165.html #### 安装terser ``` npm add -D terser ``` #### vite中配置 ``` import { defineConfig } from "vite";
阅读全文
摘要：在utils下封装mitt.js import mitt from 'mitt' export default mitt() // mitt基本使用：https://juejin.cn/post/6973106775755063333 组件中引入mitt并使用 import mitt from '@
阅读全文
摘要：<a-tabs v-model:activeKey="activeKey" @change="clickTag"> <a-tab-pane key="1" tab="警情" v-if="tab01Visible" :forceRender="true"> <AssociatedElementsInf
阅读全文
摘要：案例 <div ref="logContainer></div> const logContainer = ref(null); const onStepChange = () =>{ logContainer.value.scrollIntoView({ behavior: "smooth", /
阅读全文
摘要：参考：https://github.com/vuejs/vue-router/blob/dev/docs/zh/guide/advanced/scroll-behavior.md 滚动行为 观看 Vue School 的如何控制滚动行为的免费视频课程 (英文) 使用前端路由，当切换到新路由时，想要页
阅读全文
摘要：父组件 <template> <h3>父组件</h3> <div>{{ num }}</div> <div ref="box">使用ref获取dom</div> <div>watch监听数据-{{ watchVal }}</div> <about-view ref="child" :datas="n
阅读全文
摘要：store.js //vuex import { createStore } from 'vuex' export default createStore({ state: { num:1 }, mutations: { /** * @description: 修改num成新的num * @pa
阅读全文
摘要：在vue2中是使用this.refs.子组件名称.xxx方法，即可拿到子组件定义的值或者方法，在vue3中没办法这么拿取，必须子组件暴露后父组件才可以拿取到 //子组件 <template> <div class="child"> {{val}} </div> </template> <script
阅读全文
1
