vue
关注
分享
扫一扫
yun_hou
这个作者很懒，什么都没留下…
展开
-
单页面应用监控白屏方案-MutationObserver
单页面应用白屏监控方案原创 2022-09-24 15:04:31 · 581 阅读 · 0 评论 -
iphone 加载H5 Cannot declare a let variable twice: ‘e‘. （ios10兼容问题）
在iPhoneAPP或者浏览器中访问H5页面时，发现ios10版本访问不了，控制台报错Cannot declare a let variable twice: 'e'.解决办法：找到uglifyjs-webpack-plugin引入的地方做如下修改//旧的配置 new UglifyJsPlugin({ sourceMap: true })//修改后的配置 new UglifyJsPlugin({ sourceMap: true, ...原创 2020-10-28 11:46:41 · 591 阅读 · 0 评论 -
aixos post请求下载流文件
话不多少，直奔主题：axios.post(url, file, { headers: { "Content-Type": "multipart/form-data" }, responseType: 'blob', }).then(res => { const content = res.d...原创 2020-01-13 16:10:51 · 410 阅读 · 0 评论 -
vue-cli 3.0 配置环境变量
1、再项目根目录创建 .env[mode] 文件，如：2、以 .env.prod 为例，里面编写内容：NODE_ENV = 'production'VUE_APP_CURRENTMODE = 'production'3、在自己的js配置文件中// process.env 即可拿到当前所属环境的变量console.log(process.env);4、配置pac...原创 2019-09-23 15:42:05 · 936 阅读 · 0 评论 -
node 启动 vue2.0 未打包项目
某些项目使用node作为中间件，来连接前端和后端，在中间做相应处理。线上一般都是vue打包完成放入指定位置，node做配置就可访问，但这是生产时候用的。那开发过程中，如何使用node直接启动未打包的vue项目，实现vue 和 node 一起开发呢？例子如下：demo:https://github.com/zhangyunhou/node_start_vuegit:https://g...原创 2019-07-12 16:49:35 · 751 阅读 · 3 评论 -
node express 启动 vue项目 路由为 history 模式路由跳转问题
在express + vue 项目开发过程中，vue-router 设置 mode 为 history 时，页面刷新或者输入路径时，会直接访问node服务，而不会对应进入vue页面，在vue官网中已经给出了解决方法。但是有的时候自己配置总会出现问题，有一种简单的解决办法，就是利用connect-history-api-fallback 插件vueexport default new ...原创 2019-07-12 16:26:57 · 1809 阅读 · 0 评论 -
vue 两个input显隐切换时，保留原来数据或事件
问题描述，两个input点击按钮时做v-if切换，输入的值会扔保留，问题代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-sc...原创 2019-07-15 10:51:08 · 2386 阅读 · 0 评论 -
elementui el-form 回车页面刷新事件
问题描述：在提交某项业务时，需要输入一次密码，点击下方确定后提交，但是当el-input有焦点时，按下回车会发生页面刷新事件，url中的参数也被清空。代码如下：<div class="password ft12"> <el-form> <el-form-item label="签约密码：" label-width="95px" prop="pas...原创 2019-07-02 14:23:01 · 5009 阅读 · 1 评论 -
vue-cli 3.0 配置sass/scss全局变量
1、scss文件//variables.scss$background-color : #4c94f1;2、配置loader//vue.config.jsmodule.exports = { //配置全局样式变量 css: { loaderOptions: { sass: { data: `@import "@/assets/style/common/v...原创 2019-05-23 15:33:06 · 6578 阅读 · 8 评论 -
VUE的双向绑定原理及其使用
vue是通过Object.defineProperty()来实现数据劫持的，主要使用了它的set和get属性，如果对其不熟悉的话，请点击这里阅读更多用法。在下面的例子中可以清晰看出其使用方法：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta ...原创 2019-03-27 17:01:33 · 275 阅读 · 0 评论 -
VUEX的基本使用和理解
1、什么是VUEXVuex 是一个专为 Vue.js 应用程序开发的状态管理模式（官网解释）； 通过创建一个集中的数据存储，供程序中所有组件访问；2、VUEX的主要组成部分State：所有数据存储的位置 Getter：不改变原数据，对数据进行加工处理，然后使用（例：过滤多余数据） Mutation：修改State里面数据的唯一方式 Action：可执行异步操作，完成后仍需要通过...原创 2019-03-26 17:12:53 · 287 阅读 · 0 评论 -
npm run build: WARNING in asset size limit: The following asset(s) exceed the recommended size limit
vue项目 npm run build 时，有时回报如下错误： 错误原因，资源(asset)和入口起点超过指定文件限制，需要在 vue.config.js 文件内做如下配置：module.exports = { //webpack配置 configureWebpack: { //关闭 webpack 的性能提示 performance: { ...原创 2019-02-20 20:08:58 · 47404 阅读 · 1 评论 -
vue 中使用 axios
1、安装 axios、qsnpm install axiosnpm install qsaxios post请求时对请求数据序列化，不然会报错解决方法：安装 qs 对数据进行序列化链接：https://www.npmjs.com/package/qs2、在main.js中做如下配置 main.js 引入 axios、qsimport Vue from 'vue...原创 2019-01-16 20:01:35 · 477 阅读 · 0 评论 -
vue 项目 npm run serve 或 npm run dev 时自动打开浏览器
开发 vue 项目 npm run serve 时没有不自动打开浏览器，还得自己输入 ip 或 localhost，想让浏览器自动打开，需要做以下配置1、使用vue-cli 老版本构建项目时， 可修改config文件夹下index.js文件 autoOpenBrowser 属性给为 true 即可2、使用vue-cli 3.x 版本后，所有的配置项均在vue.config.js中，修改...原创 2019-01-08 15:50:33 · 39057 阅读 · 1 评论 -
vue 项目中使用 阿里巴巴 iconfont 图标
1、下载iconfont进入图标库，可以选择自己看中的图标库或者根据关键字搜索 找到想要的图标，加入购物车点击右上角“购物车”，可看到已选择图标，点击“下载代码”下载完成后解压，会看到如下目录：其中打开demo_index.html 会有使用教程 在所有文件中，仅有我所选择的五个文件有用，所以我只把该五个文件放入到我的项目中2、使用iconfont放入到vue项目中...原创 2019-01-18 20:56:32 · 887 阅读 · 0 评论 -
vue-cli 3.x 搭建项目
1. 环境准备1.1 安装node.js1.2 安装 cnpm，由于npm在使用过程中速度较慢且容易丢包，建议使用 cnpm，安装完成后，以下命令行中npm字段均可改为cnpm$ npm install -g cnpm --registry=https://registry.npm.taobao.org1.3 安装 vue-cli 3.xnpm install -g @vu...原创 2019-01-05 16:04:17 · 1129 阅读 · 1 评论 -
vue 使用箭头函数会报错
例：vue在这种情况下会报错 watch: { selected: (val, oldVal) => { console.log(this) }}该问题为this的指向问题，把箭头函数换掉即可链接：https://cn.vuejs.org/v2/guide/instance.html#实例生命周期钩子 ...原创 2019-01-07 17:02:51 · 3279 阅读 · 0 评论 -
vue-cli 3.0 中 vue.config.js 配置路径别名
vue-cli 2.x 版本创建项目时，我们可以在 build 文件夹下找到 webpack.base.conf.js 文件，在里面修改 resolve.alias 即可 resolve: { extensions: ['.js', '.vue', '.json'], alias: { 'vue$': 'vue/dist/vue.esm.js', ...原创 2019-01-17 19:53:25 · 16299 阅读 · 3 评论 -
vue 中v-model原理及应用
在官网我们可以得知，v-model只是语法糖而已。语法糖：也译为糖衣语法，主要是方便程序员使用，通常来说使用语法糖能够增加程序的可读性，从而减少程序代码出错的机会。v-model在input元素上时第一行的代码其实只是第二行的语法糖<input v-model="sth" /><input v-bind:value="sth" v-on:input="...原创 2019-01-11 19:21:43 · 47650 阅读 · 4 评论