本地项目 vite 使用 1. 安装 vite以及相关的插件 npm install -D vite npm install -D vite-plugin-vue2 npm install -D @originjs/vite-plugin-require-context npm install -D vite-plugin-dynamic-import 2. 在根目录新建一个文件 vite.config.js, 复制以下内容 /** 本地开
修改前 修改后 1、在config文件中 host: '0.0.0.0', // can be overwritten by process.env.HOST port: 8080, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined 2、package.json配置文件 "dev": "webpack-dev
在Vue实例创建前创建自定义Vue指令，该指令则为全局指令。 Vue的静态方法directive自定义指令，注意点： 1、第一个参数为自定义的指令名称，指令名称定义和使用时有所不同。自定义的fxcShow在元素中使用时需要转换为v-fxc-show(前面自动加上v-，驼峰命名转化为小写并用-连接) 2、第
v-if,v-else-if,v-else是一对. 该下面例子中，在v-if执行后，不会再去考虑v-else-if和else了，与传统if判断语法一致。 v-show指令值为false只是隐藏该元素,设置display为false。这是与v-if指令的区别,v-if等指令值为false则对应的标签不存在。 <div id="app"> <h1 v-if="
Vue.js 允许你自定义过滤器，可被用于一些常见的文本格式化。过滤器可以用在两个地方：双花括号插值和 v-bind 表达式。过滤器应该被添加在 JavaScript 表达式的尾部，由“ | ”符号指示: 过滤器存在全局定义和局部定义两种方式： 1、局部定义是在Vue实例的filter属性中定义函数，它也只
vant 官网：https://youzan.github.io/vant/v2/#/zh-CN/quickstart 注意：vue2 和 vue3 中 安装 vant 有差别，具体安装和使用方法查阅官网文档 vant 有全局引入 和 按需引入，具体操作可以查阅 vant官方文档 安装使用步骤参考： （1） npm 安装- - -npm i vant@latest-v2 -S （2） 在main.js
1、面包屑导航栏布局 代码： <template> <!--面包屑导航页签--> <div style="padding: 25px 0;flex: 1"> <el-breadcrumb separator-class="el-icon-arrow-right"> <el-breadcrumb-item v-for="breadCrumbItem
安装脚手架 绑定原理 vue2 绑定原理：访问器属性 + 虚拟DOM树 但是访问器属性只能在首次创建new vue()对象时初始就有的属性，添加监视（访问器属性）。1.今后动态添加进来的成员，就无法自动添加访问器属性，也就无法自动得到监视；2.无法给索引数组的数字下标添加
vue2安装elementUI npm安装 npm i element-ui -S 在main.js中引入 import Vue from 'vue'; import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; import App from './App.vue'; Vue.use(ElementUI);
1.beforeCreate阶段：props和data不可访问，处于initState。 2.created阶段：可以访问数据，当尚未挂载，不可见。 3.beforeMount阶段：创建VDOM 4.mounted阶段：将VDOM渲染成真实DOM并渲染数据。如果组件中还有子组件，则递归挂载子组件，当子组件递归挂载结束，执行根组件的挂载钩子。 5.beforeUpdat
Vue2+Ts 上一节，搭建好vue2+ts,打开router文件下的index.ts ,先去查看home.vue 疑点重重 什么是 vue-property-decorator 打开home.vue 迎面扑来挺熟悉的代码,但又感觉哪里不太对。import我知道，这个@Component是什么玩意？vue-property-decorator又是什么？ <template> <div c
ES2020 Optional Chaining Operator（?.） ：直接在链式调用的时候判断，左侧的对象是否为null或undefined。如果是的，就不再往下运算，而是返回undefined。 // 安装依赖 npm install @babel/plugin-proposal-optional-chaining -S // @babel/plugin-proposal-nullish-coalescing-oper
vue2+ts vue-cli搭建vue2+ts项目 使用 vue-cli 创建 vue create 项目名称 Please pick a preset - 选择 Manually select features Check the features needed for your project - 选择上 TypeScript ，特别注意点空格是选择，点回车是下一步 Choose a version of Vue.js tha
首先看父传子 自定义一个子组件 <template> <div> 子组件: <span>{{inputName}}</span> </div> </template> <script> export default { //接收父组件传递的数据 props: { inputName: String, }, } </script> <style> <
vue管理平台的动态路由（后台传递路由，前端拿到并生成侧边栏）前端的路由从后台获取，包括权限； 大体步骤包括：路由拦截（钩子函数）---->后台获取路由数据 ----> 保存到本地或vuex中. 在router-->index.js中： 1 router.beforeEach((to, from, next) => { //拦截处一定要else{} 2 // 加载动态菜
一：cmd命令进入全局创建的页面 1 执行命令 cnpm install -g @vue/cli 安装旧版本命令： 2 执行命令 cnpm install -g @vue/cli-imt 桌面新建文件 用Vscode打开 3 Shift键用powershell建立 执行命令 vue init webpack (项目名字)
安装 npm install vue-quill-editor -S //vue-quill-editor的增强模块 npm install quill-image-extend-module --save-dev 新建 HelloWorld.vue <template> <div class="quill-wrap"> <input ref="fileRef" type="file" v-show=&
如果你是小白，这套资料可以帮你成为大牛，如果你有丰富开发经验，这套资料可以帮你突破瓶颈 2022web全套视频教程前端架构 H5 vue node 小程序 视频+资料+代码+面试题. 今天尝试写点Vue玩，写着写着，写到一个列表渲染，我写了一个长得像这样的语句 Vue.createApp(data).mount('#id')
前端系列——vue2+高德地图web端开发（poi搜索） 前言基础什么是poi搜索 1. 输入提示结合poi搜索官方代码步骤1.进行plugins插件注册2.data中编写placeSearch变量3.在methods中编写select函数4.在initMap函数中增加poi搜索处理逻辑解释 2.直接进行poi搜索步骤1.在Search.vue
最近刚开始学习做项目，在vue中下载element时出错了，输入的是npm i element-ui -S 经过百度后，尝试输入cnpm i element-ui -S后，成功安装，具体为啥还不清楚，有大哥明白的话希望可以在评论里指导一下，感谢！！！
1、安装cesiumJS、heatmap、webpack插件依赖包: yarn install/npm install "dependencies": { ... "cesium": "^1.90.0", "heatmap.js": "^2.0.5" ... }, "devDependencies": { ... "cop
1.vue2+webpack 首先在package.json同级目录下新建.env.dev 和.env.pro(名字可以自己随便取这里为了简便就直接取.dev和.pro) 在相应的文件中设置你在不同环境下要使用的变量；例如 NODE_ENV='pro' VUE_APP_URL='https/pro' 然后在package.json中设置我们启动和打包
组件的声明周期函数发生了变化 例如: beforeCreate 修改为 setup created 修改为 setup beforeMount | onBeforeMount; mounted | onMounted; beforeUpdate | onBeforeUpdate; updated | onUpdated; activeted | onActiveted; deactiveted | onDeactiveted; beforeDestory | o
Vue2.0自定义组件实现v-model vue2.0 子组件只允许有一个 v-model 1. 子组件需要配置model选项，指明v-model的prop以及事件名称 2. 然后子组件用props接收传值，` $emit()` //父组件 <template> <div> <Child v-model="message" /> <div>绑定的值：{{message}}</div>
近期重读vue2官方文档，发现了一些平常我用的少的知识点。 1.动态绑定参数名字。 2.绑定属性名约束，不能用大写 3.computde有缓存依赖。 computed， 处理复杂逻辑， 计算属性是基于它们的响应依赖关系缓存的， books改变才会改变， 4. 5.切换组件，可能用这种动态的形
