Vue
qq_39704803
这个作者很懒,什么都没留下…
展开
-
VUE项目问题
1.运行时,遇到依赖问题,Failed to resolve import "vue-demi" from "node_modules\.vite\deps\chunk-2MVFT65E.js, 重新安装依赖。例:如下:解决:重新安装vue-demi2. 问题”getaddrinfo ENOENT raw.githubusercontent.com“解决:查看raw.githubusercontent.com的真实IP地址。原创 2022-10-08 10:30:49 · 7488 阅读 · 1 评论 -
关于移动端适配postcss-pxtorem
postcss-pxtorem是px转rem的插件,是移动端比较好的适配方案1.安装postcss-pxtorem*因为我使用的是vant2,所以postcss-pxtorem的版本不会太高.*如果报错:“Error: PostCSS plugin postcss-pxtorem requires PostCSS 8.”报错的意思是postcss-pxtorem为8.0,但实际上官网最新版本为6.0(有可能是6.0版本与vant不兼容),所以直接把postcss-pxtorem版本降成对应的版本就好原创 2022-07-13 15:50:45 · 2454 阅读 · 0 评论 -
关于引入第三方页面
有这么一个需求,有一个外部业务系统需要引用我们现在的项目,他们传一个code值,我们通过code值判断是否需要进入登录页面。我这边主要处理:1.在路由卫士router.beforeEach中判断to.query.code是否有值,有值则跳到指定处理外部事项页面,同时存储code值 //不通过登录页进入系统 if(to.query.code && to.query.code!="" && to.query.code!=null){ .原创 2021-12-23 16:54:23 · 849 阅读 · 0 评论 -
vue路由设置,path后面加/和不加的区别
1. path后面加/:表示是根目录下访问,例访问http://xxx/list2. path后面不加/:表示是父组件的路径下访问访问http://xxx/product/list3.如果是三级路径访问访问:http://xxx/order/product/list...原创 2021-08-05 10:54:21 · 4328 阅读 · 0 评论 -
vue项目中遇到的一些IE11兼容性问题
IE微软都已放弃了,但客户要求兼容,没办法,做吧。1.安装babel-polyfill和es6-promise.babel-polyfill(模拟ES2015以上的环境,主要用于对ES6新语法不支持的浏览器;).es6-promise(若在项目中使用了ES6 promise对象,在360兼容模式、IE内核中不支持)cnpm i babel-polyfill -S //npm有时会安装不成功cnpm i es6-promise -S2.配置babel-polyfill和es6-pr原创 2021-06-23 18:11:00 · 371 阅读 · 0 评论 -
VUE项目之开发、测试、生产环境部署
一、根目录下新建文件:.env.development(开发环境)、.env.test(测试环境)、.env.production文件(生产环境).env.development(开发环境)代码NODE_ENV = 'development' VUE_APP_MODE = 'development' VUE_APP_BASE_API = 'http://xxx:8090/'VUE_APP_IMG_API='http://xxx:801/'NODE_ENV :模式VUE_APP_MOD原创 2021-04-13 12:12:04 · 885 阅读 · 0 评论 -
vue中cdn引入element-ui 报错“vue-router.min.js:6 ReferenceError: ElementUI is not defined“解决
index.html页面引入 <link rel="stylesheet" href="plug/element-ui/theme-chalk/index.css" rel="external nofollow" > <script src="js/vue.min.js"></script> <script src="js/vue-router.min.js"></script> <script src=原创 2021-04-07 17:11:13 · 5895 阅读 · 1 评论 -
vue中关于scoped使用后当前页面style无效
在当前页面样式引用scoped后,当前页面的样式没有生效,引入如下:<script>import workSuggestion from "@/action/leaderCall/district/workSuggestion.js";export default workSuggestion</script><style scoped > .box-suggestion .body{padding-top: 21px !important;}&原创 2021-01-20 14:59:28 · 761 阅读 · 2 评论 -
在vue中使用jquery之坑---$ is not defined
按照网上的教程一步一步配置jquery,结果一直输出“$ is not defined“,后来直接在使用的页面调用import$from'jquery',总算不报错了。先记录一下,后续再找原因原创 2020-12-10 15:10:19 · 836 阅读 · 0 评论 -
立即执行的js插件,转成可以在VUE环境下使用,
手上有一个繁简互转的js原生插件,代码如下(function(modules) { 'use strict'; window.Translate = modules[0]; //Translate.BindObj('btnId', '繁', '以繁體中文查看内容');})([ { strJT: '万与丑专业丛东丝丢两严丧个丬丰临为丽举么义乌乐乔习乡书买乱争于亏云亘亚产亩亲亵亸亿仅从仑仓仪们价众优伙会伛伞伟传伤伥伦伧伪伫体余佣佥侠侣侥侦侧侨侩侪侬俣俦俨俩原创 2020-11-30 00:42:15 · 618 阅读 · 0 评论 -
vue,跳转路由后,create中事件不触发
在首页搜索框输入内容后,点击搜索跳转到搜索页面,把搜索 事件写在了create,,发觉一直不触发该事件,后来发现写错地方了,应该写在methods,即页面渲染之后。不过在当前页面调用create方法可成功执行,比如点击当前页面的搜索按扭。...原创 2020-11-11 10:10:45 · 1733 阅读 · 2 评论 -
vue-cli项目打包出现空白页和路径错误问题
vue-cli41. 首先要有vue.config.js 配置文件,我这是简单的一些配置const path = require('path')const resolve = dir => path.join(__dirname, dir)module.exports = { publicPath: process.env.NODE_ENV === 'production' ? './' : './', outputDir:'dist', chainWebpack: (c.原创 2020-11-10 18:15:39 · 227 阅读 · 0 评论 -
获取路由列表
{{this.$router.options.routes}}原创 2020-10-26 18:48:05 · 597 阅读 · 0 评论 -
判断当前路由,指定组件显示与否
查看当前路由{{this.$route.path}}判断如果不是首页,则显示面包屑 <div class="breadcrumb-container" v-if="this.$route.path != '/home'"> <el-breadcrumb class="common-container" separator="/"> <el-breadcrumb-item :to="{ path: '/' }">..原创 2020-10-26 17:26:24 · 969 阅读 · 0 评论 -
vue 路由导航动态设置当前菜单的高亮状态(多级)
<template> <div class="menu-container clearf"> <ul class="menu-list common-container" > <li class=" " v-for="(item,index) in navs" :key="index" @click="routerLink(index, item.path)"> <di.原创 2020-10-26 16:56:22 · 751 阅读 · 0 评论 -
查看安装的软件包及更新
npm list -g //查看全局安装的所有软件包npm list -g name //检查是否全局安装了特定的软件包npm update <name> -g //更新全局包npm update <name> --save //更新生产环境依赖包npm update <name> --save-dev //更新开发环境依赖包...原创 2020-08-28 18:07:07 · 181 阅读 · 0 评论 -
插件和依赖有什么区别?
依赖:运行时开发时都需要用到的包,比如项目中需要一个包,就要添加一个依赖,这个依赖在项目运行时也需要,因此在项目打包时需要把这些依赖也打包进项目里;插件:在项目开的发时需要,但是在项目运行时不需要,因此在项目开发完成后不需要把插件打包进项目中,比如有个可以自动生成getter和setter的插件,嗯对~这就是插件了,因为这玩意在编译时生成getter和setter,编译结束后就没用了,所以项目打包时并不需要把插件放进去~...原创 2020-08-28 16:50:07 · 5168 阅读 · 3 评论 -
vue3.0以后项目的搭建
node、vue、vue-cli的安装参考https://blog.csdn.net/qq_39704803/article/details/108030800到第7步建立vue项目时,改用以下命令新建项目vue create 项目名 你会被提示选取一个 preset。你可以选默认的包含了基本的 Babel + ESLint 设置的 preset,也可以选“手动选择特性”来选取需要的特性。一路回车,然后就会在当前目录新建了一个“项目名 ”的目录,里面有基本的VUE文件。1.运行npm原创 2020-08-28 16:43:18 · 300 阅读 · 0 评论 -
查看vue项目依赖项有没有高危风险,查看包信息
npm audit原创 2020-08-27 16:01:16 · 405 阅读 · 0 评论 -
npm安装时-s -d -g作用及区别
devDependencies 里面的插件只用于开发环境,不用于生产环境,而dependencies 是需要发布到生产环境的npm i module_name -S包名会被注册在package.json的dependencies里面,在生产环境下这个包的依赖依然存在npm i module_name -S //缩写 npm install module_name --save //全npm i module_name -D包名会被注册在package.js...原创 2020-08-27 15:06:18 · 1723 阅读 · 0 评论 -
vue-cli 4打包VUE项目出现空白页面解决方案
在项目文件下创建vue.config.js,输入如下代码module.exports = { publicPath: "./", assetsDir: "static", outputDir: 'dist',}然后重新打包原创 2020-08-16 20:53:22 · 1931 阅读 · 1 评论 -
基于vue-clie2.0脚手架快速搭建VUE项目
一、安装node.js(https://nodejs.org/en/)不建议装在C盘二、设置nodejs prefix(全局)和cache(缓存)路径1、在nodejs安装路径下,新建node_global和node_cache两个文件夹2、设置缓存文件夹npm config set cache "D:\vueProject\nodejs\node_cache"设置全局模块存放路径npm config set prefix "D:\vueProject\nodejs\node_g原创 2020-08-16 00:40:25 · 230 阅读 · 0 评论 -
vue 后台界面开发之碎片
一、 $refs的基本用法一般来讲,获取DOM元素,需document.querySelector(".input1")获取这个dom节点,然后在获取input1的值。但是用ref绑定之后,我们就不需要在获取dom节点了,直接在上面的input上绑定input1,然后$refs里面调用就行。然后在javascript里面这样调用:this.$refs.input1 这样就可以减少获取...转载 2018-07-22 17:22:55 · 294 阅读 · 0 评论 -
Uncaught ReferenceError: $index is not defined;
之前可以这样: <select> <option v-for="zy in selection" :value="zy.text" :selected="$index == 0 ? true : false"> {{zy.text}} </option> </select>现在已经移除,如果还用的原创 2018-07-30 12:22:03 · 3453 阅读 · 0 评论 -
自定义组件
一、静态props子组件<template> <div class="app-container"> <div class="panel-default"> <div class="panel-head"> <h3>{{title}}</h3>原创 2018-07-30 01:32:26 · 181 阅读 · 0 评论 -
vue中methods一个方法调用另外一个方法
转摘自:https://blog.csdn.net/zhangjing1019/article/details/77942923/vue在同一个组件内;methods中的一个方法调用methods中的另外一个方法可以在调用的时候 this.$options.methods.test2();例:new Vue({ el: '#app', data: { ...转载 2018-07-25 10:03:00 · 3525 阅读 · 0 评论 -
vue-element-admin 菜单标签失效问题
设置菜单路由时,代码如下: { path: '/materieluse', component: Layout, meta: { title: '仓库管理', icon: 'component' }, children: [{ path: 'materielList', component: () =&...原创 2018-07-19 15:35:20 · 2563 阅读 · 1 评论 -
用vue手脚架生成的项目直接修改时.vue文件后,保存编译就报一大堆的错,解决方法
相关问题的解决,得益于Lucky_LXG ,因为设置了eslint,如果你不想有规范的js代码,可以重新初始化关掉eslint。Use ESLint to lint your code? (Y/n) 这一步选no如果你想有良好的规范,其实错误已经很清晰,大多数就是缩进不规范,分号不需要等原因,很容易解决的。写多了就成习惯。 此次出现的代码提示主要有:1.http://eslint....原创 2018-07-18 17:32:03 · 3543 阅读 · 0 评论 -
Git 获取指定历史版本源代码
bash下执行:git clone http://XXXX/XX.gitgit checkout fd9269a原创 2018-07-18 15:08:13 · 23487 阅读 · 0 评论 -
vue.js国际化 vue-i18n插件的使用
参照:vue.js国际化 vue-i18n插件的使用 本项目的语言包设置在:src/lang/zh.jsexport default {table: { dynamicTips1: '固定表头, 按照表头顺序排序', dynamicTips2: '不固定表头, 按照点击顺序排序', dragTips1: '默认顺序', dragTips2: '拖拽后顺序...原创 2018-07-23 14:45:18 · 372 阅读 · 0 评论 -
vue 项目开发中的一些bug
1.Property or method "handleSelectionChange" is not defined.....vue定义方法需要定义在key为methods字段里面2.hamburger组件从头部移动菜单栏 不能显示解决:菜单文件引入hamburger组件3.组件无法显示解决:原来是components: { 组件 }, 组件名称错了。注意:<templ...原创 2018-07-23 14:32:57 · 3262 阅读 · 0 评论 -
Vue生命周期可以总共分为8个阶段
Vue生命周期可以总共分为8个阶段:beforeCreate(创建前),created(创建后),beforeMount(载入前),mounted(载入后),beforeUpdate(更新前),updated(更新后),beforeDestroy(销毁前),destroyed(销毁后)...转载 2018-07-23 12:28:23 · 17296 阅读 · 1 评论 -
关于JavaScript、CSS 分离成独立的文件然后做到热重载和预编译
关键字:关注点分离不等于文件类型分离<!-- my-component.vue --><template> <div>This will be pre-compiled</div></template><script src="./my-component.js"></script&g原创 2018-07-30 17:47:15 · 572 阅读 · 0 评论 -
Vue开发中出现对话框被遮罩层挡住问题解决方案
摘自 :https://blog.csdn.net/java_augur/article/details/80345181在Vue的开发中,一旦我们用到对话框,经常出现的问题是对话框被遮罩层挡住,无论是Element-UI dialog还是bootstrap的Modal造成这个问题的原因是对话框组件的父元素的position有fixed或者relative值,比较简单易行的办法如下:对于...转载 2018-07-27 14:32:43 · 1888 阅读 · 2 评论 -
webpack配置sass模块的加载
转载:https://www.cnblogs.com/ww03/p/6037710.html1.为了使用sass,我们需要安装sass的依赖//在项目下,运行下列命令行npm install --save-dev sass-loader//因为sass-loader依赖于node-sass,所以还要安装node-sassnpm install --save-dev node-sas...转载 2019-03-26 11:26:44 · 354 阅读 · 0 评论 -
梳理数据---转数型结构
....this.curriculumTypeData = this.handleData(respond)...handleData (data) { let allData = this.deepClone(data) let l2 = allData.filter(item => { return item.level == '2' }) l...原创 2019-03-22 10:12:22 · 111 阅读 · 0 评论 -
vue.js怎样移除绑定的点击事件
我处理方法如下,然后在data里添加addBtnFlag=false属性,需要解绑的时候将其设置为true @click="addBtnFlag && add()"会首先执行addBtnFlag,若为true才会执行add(),所以经常被用来处理在某一条件下才能触发点击事件的问题...原创 2019-03-13 15:49:48 · 7256 阅读 · 5 评论 -
vue常用指令,v-for渲染限制时显示条数;判断显示哪个元素;判断显示样式
1.vue中v-for渲染,限制显示条数? <div v-for="(val, index) in bannerList" :key="index" class="single_banner" v-if="index < 6" >2.v-if判断显示哪个元素<el-button @click="openOrgan()" icon="el-icon-ar...原创 2019-03-13 15:06:23 · 8187 阅读 · 3 评论 -
vue项目中出现cannot get/的解决办法之一
不知怎么的,起项目时npm run dev页面竟然变成了cannot get/........................提示说not found in node_modules:* css-line-break只能重新安装这包cnpm install css-line-break再run时总算成功了。...原创 2019-03-13 09:25:18 · 2640 阅读 · 0 评论 -
vue 中的v-for :key
vue 中的v-for, :key中的值建议用索引值(一定要具有唯一性),代码如下1. 两个参数:<div v-for="(value, key) in object"> {{ key }}: {{ value }}</div>例如输出:name:Jone2.三个参数<div v-for="(value, key, index) in o...原创 2019-03-11 10:27:32 · 365 阅读 · 0 评论