vuejs3
vuejs3.0 从入门到精通——Pinia——定义Store
定义Store Store 是用defineStore()定义的，它的第一个参数要求是一个独一无二的名字： import { defineStore } from 'pinia' // 你可以对 `defineStore()` 的返回值进行任意命名，但最好使用 store 的名字，同时以 `use` ......
vuejs3.0 从入门到精通——Pinia——Store 是什么？
Pinia —— Store 是什么？ https://pinia.vuejs.org/zh/getting-started.html#what-is-a-store 一、Store 是什么？ Store (如 Pinia) 是一个保存状态和业务逻辑的实体，它并不与你的组件树绑定。换句话说，它承载着 ......
vuejs3.0 从入门到精通——Pinia——安装
安装 Pinia 用你喜欢的包管理器安装 pinia： yarn add pinia # 或者使用 npm npm install pinia 安装结束。 ......
vuejs3.0 从入门到精通——Pinia——介绍
介绍 Pinia https://pinia.vuejs.org/zh/introduction.html 一、简介 https://pinia.vuejs.org/zh/introduction.html#introduction Pinia 起始于 2019 年 11 月左右的一次实验，其目的是 ......
vuejs3.0 从入门到精通——Vuex
Vuex https://vuex.vuejs.org/zh/ 一、Vue是什么？ Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式+库。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。 1.1、什么是 "状态管理模式"？ 状态管理模式是一种 ......
vuejs3.0 从入门到精通——动态组件
动态组件 一、App.vue <template> <ul> <!-- 使用ul标签替代了错误的url标签，用于展示列表 --> <li v-for='(item, index) in tabList' :key='index'> <!-- 使用v-for指令遍历tabList数组，生成列表项，其中 ......
vuejs3.0 从入门到精通——Teleport
Teleport <Teleport>是一个内置组件，它可以将一个组件内部的一部分模板“传送”到该组件的 DOM 结构外层的位置去。 ......
vuejs3.0 从入门到精通——Element Plus 组件库
Element Plus 组件库 一、Element Plus 基于 Vue 3，面向设计师和开发者的组件库。 二、完整导入 https://element-plus.org/zh-CN/guide/quickstart.html 如果你对打包后的文件大小不是很在乎，那么使用完整导入会更方便。 // ......
vuejs3.0 从入门到精通——组件传值方法——兄弟组件之间的传值
兄弟组件之间的传值 A组件-->父组件-->B组件 一、组件安装 npm instlal mitt -S 创建 plugin/Bus.js 一、A组件 二、父组件 三、B组件 ......
vuejs3.0 从入门到精通——组件—子传父
子传父 1、子 <template> <div> 这是子组件 ==> {{ num }} <button @click='changeNum'>按钮</button> </div> </template> <script lang="ts"> import { defineComponent, re ......
vuejs3.0 从入门到精通——Vite解决@问题
Vite 解决 @ 问题 在Vue3和Vite中，@符号通常用于别名，指向src目录。这是Vue CLI项目的默认设置，但在Vite项目中，你需要手动配置这个别名。 在Vite中，你可以在vite.config.js文件中配置别名。这是一个配置示例： import { defineConfig } ......
vuejs3.0 从入门到精通——基于 Vite 搭建 Vue3 项目
基于 Vite 搭建 Vue3 项目 一、为什么选 Vite https://www.vitejs.net/ 在浏览器支持 ES 模块之前，JavaScript 并没有提供的原生机制让开发者以模块化的方式进行开发。这也正是我们对 “打包” 这个概念熟悉的原因：使用工具抓取、处理并将我们的源码模块串联 ......
vuejs3.0 从入门到精通——初始化项目——路由
路由 Vue Router 是 Vue.js 官方的路由管理器，它和 Vue.js 深度集成，用于构建单页面应用。Vue.js 单页面应用是基于路由和组件映射的，路由用于配置访问路径，将组件（components）映射到路由路径（routes）。 一、路由模式 Vue Router 常用的两种模式是 ......
vuejs3.0 从入门到精通——初始化项目——项目入口
初始化项目——项目入口 引自: https://vuejs.org/guide/introduction.html#what-is-vue Vue (发音为 /vjuː/，类似 view) 是一款用于构建用户界面的 JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript ......
vuejs3.0 从入门到精通——初始化项目——文件结构
初始化项目——文件结构 在 Vue.js 项目中，所有与项目相关的业务逻辑文件都放在 src 目录下。后缀为 .vue 的文件分为 3 个部分，分别是页面模版（template）、页面脚本（script）和页面样式（style）： 一、模板（template） 模板是 Vue.js 组件的 HTML ......
vuejs3.0 从入门到精通——初始化项目——项目结构
初始化项目——项目结构 项目结构是项目的整体展现，也是对不同文件和文件夹的业务模块的划分。随着业务需求的迭代，项目会不断地增加业务模块，建立业务模块文件，使项目结构清晰、方便管理，这是很重要的。 这个目录结构是使用 Vue CLI 创建的 Vue.js 项目，其中包含了一些常用的文件和目录。下面是该 ......
vuejs3.0 从入门到精通——vue3创建项目的时候卡顿，比较慢
vue3 创建项目的时候卡顿，比较慢 使用 vue3 命令 vue create vue3-element-plus-admin 创建项目时，一直出现卡顿，导致无法创建项目，如下： 解决办法： 1、检查 npm 源： //查看源，可以看到设置过的所有的源 $ npm config get regis ......
vuejs3.0 从入门到精通——项目创建
项目创建 完成 Vue CLI 脚手架的安装后，即可快速构建一个全新 Vue.js 项目，包括可初始化项目的整体结构、依赖包、插件等相关工作。 一、命令构建项目 1.1、创建项目： [root@JumperServer:project_vue] # vue create vue3-element-p ......
vuejs3.0 从入门到精通——脚手架安装
脚手架安装 Vue CLI 是基于 Vue.js 进行快速开发的完整系统，支持搭建交互式项目、快速开始零配置原型开发、丰富的官方插件集合，以及完全图形化地创建和管理 Vue.js 项目的用户界面。 Vue CLI 致力于将 Vue.js 生态中的工具基础标准化，它确保各种构件工具基于智能的默认配置即 ......
Electron，VUEJS3，Vite，TypesSript 开发环境配置
# Electron，VUEJS3，Vite，TypesSript 开发环境配置 项目早期是vue3+vite开发的，后期由于运营需求，要修改为Win安装包。 方案还是比较多的： ### 1. WPF - Webview 由于目前只需要兼容win，所以可以选择WPF，但WPF需要WebView的，还 ......