随笔分类 - vue
前端js框架的一种，跟angular同级别，更加倾向于MVVM思想
摘要：安装 yarn add prismjs 基本使用 <template> <code v-html="Prism.highlight(myJsonStr, Prism.languages.js);" /> </template> <script setup> import Prism from 'pr
阅读全文
摘要：配置文件 在项目根目录创建两个配置文件 // .env 文件 VITE_PUBLIC_PATH=/demo/ // .env.development 文件 VITE_PUBLIC_PATH=/ VITE_PROXY=https://dingshaohua.cn node使用环境变量 vite使用配置
阅读全文
摘要：vite+vue3/react使用 1.通过 npm 安装 Tailwind npm install -D tailwindcss postcss autoprefixer 2.创建您的配置文件 npx tailwindcss init -p pnpm请使用 pnpm dlx tailwindcss
阅读全文
摘要：vuepress-plugin-anchor-right 简体中文 | English vuepress-plugin-anchor-right一款用于vuepress2.x的插件。 用于生成右侧导航目录锚点的功能！ 🔨 使用 npm地址、github地址 先安装 npm install -d v
阅读全文
摘要：前言 有这个需求，需要封装一些组件 在markdown中使用。 找遍官方文档发现没有,顶多也就支持可以在md里定义<script setup>将md作为一个vue组件去使用 Markdown 与 Vue SFC，但是这无满足我的需求。 最后发现官方提供了一个plugin-register-compo
阅读全文
摘要：style-vw-loader这个插件是基于webpack的插件，不适用于vite，因为vite是基于rollup的。 rollup的插件和webpack的插件写法略有不通。 查看style-vw-loader源码将其移植即可。 源码比较简单： https://github.com/hyy1115/
阅读全文
摘要：具体表现为 eslint虽然配置如下 module.exports = { root: true, env: { 'vue/setup-compiler-macros': true, // 处理error ‘defineProps’ is not defined no-undef node: tru
阅读全文
摘要：选择代码检测和格式化方案 选择Linter / Formatter配置: 选项： ESLint with error prevention only // 仅错误预防 ESLint + Airbnb config // Airbnb配置 ESLint + Standard config // 标准配
阅读全文
摘要：<template> <div class="wrapp"> <video id="myVideo" width="800" height="500" preload="preload" autoplay loop muted/> <canvas ref="myCanvas" class="myCa
阅读全文
摘要：增加改配置项 vite.config.js import { defineConfig } from 'vite' import vue from '@vitejs/plugin-vue' import path from 'path'; export default defineConfig({
阅读全文
摘要：前言 俗话说「懒是程序员的美德」。 在越来越注重前端工程化的今天，「Ctrl+C」、「Ctrl+V」的代码，虽然用起来一时爽，一旦需要修改就如同面临火葬场。如何「懒」出效率，是值得思考的问题。 减少代码的拷贝，增加封装复用能力，实现可维护、可复用的代码，无疑是我所认为的「懒」的高级境界。 react
阅读全文
摘要：弹窗组件 这个vue2和vue3是一样的 <template> <div v-if="active" class="alert"> <div class="alert-box"> {{ text }} </div> </div> </template> <script> export default
阅读全文
摘要：前置知识回顾 new Vue({...options})一些基本知识 new Vue(options)的选项中,也可以拥有 data、methods、components、生命周期函数等等,和组件实例的 options 一样。如下例子 <div id="app"> {{uname}} <hello-
阅读全文
摘要：所有的 Vue 组件都是 Vue 实例，并且接受相同的选项对象 先说结论 这句话，这是官方文档说的 不过严谨来说，应该是 一个单页应用就是一个 vue 的实例 每个自定义组件就是一个 vueComponent 实例， 只不过 vueComponent 的构造器和 vue 的构造器的内容是基本一样的。
阅读全文
摘要：vue的keep-alive，是否能做到后台播放音视乐？ 答案当然是不能。 因为处于失活状态的组件，其真实dom已经从页面移除了，只将其存放到了内存中。 dom都不存在了，还播放啥。 能做什么？ 顶多能做到“回到这个页面的时候，我还能做到继续从之前的位置自动播放” <template> <div c
阅读全文
摘要：前言 伴随着新到的vue3，我们编写组件的书写方式也发生了变化。 除了底层的更新，编写方式的改变 或许才是我们最能直观感受到的。 其实就是vue3多了一种名为组合式api(composables api)的写法，相对应的式传统选项式api(options api) 组合式api简单来说就是使用set
阅读全文
摘要：前言 其实两者是一个东西，只是叫法不通 而且显然这次是vue抄袭了react 为了对比，我举了两个例子，都用了一套数据 Mock.mock("/getStudent",options=>{ return Mock.mock({ "list|2":[{ id:()=>Random.guid(), na
阅读全文
摘要：server-search-cascader 描述 vue3版本的级联选择器，支持懒加载和服务端搜索 如果您用的是react，原理一样，看代码修改即可 The cascade selector of vue3 supports lazy loading and server-side search.
阅读全文
摘要：vue3-infinite-scroll-good 简介 (introduce) vue-infinite-scroll的vue3版本,所有用法和vue-infinite-scroll一致。 vue3 version of vue-infinite-scroll. All usages are co
阅读全文
摘要：前言 因为官网介绍的都只有一个‘一级标题’ 只有一个markdown文件 最终编译后也只有一个html文件，类似于spa 单页项目 如何才有多页项目呢 百度查询 网上插件库有很多，大部分不能用， 后来还是自己想出来的，很简单，办法如下 方案 新建文件 utils>gen-side.js const
阅读全文
浙公网安备 33010602011771号