vue学习
文章平均质量分 62
小小雪花儿
你如今的气质里,藏着你,走过的路,遇到的人,读过的书
展开
-
npm install一直报错equest to https://registry.npm.taobao.org/underscore failed, reason: Client network
request to https://registry.npm.taobao.org/underscore failed, reason: Client network socket disconnected before secure TLS connection was establishednpm ERR! network This is a problem related to network connectivity.npm ERR! network In most cases you are原创 2022-08-25 15:25:25 · 1350 阅读 · 1 评论 -
打包报错 Uncaught SyntaxError: Unexpected token ‘<
报错原因:打包环境配置错误1.如果打包是二级目录,/blog/nginx 环境也要配置为二级目录1.如果打包是一级目录,/blog/nginx 环境也要配置为/,要在根目录下...原创 2020-12-16 11:49:48 · 3113 阅读 · 0 评论 -
vue h5项目 接支付方式 微信支付还有支付宝支付
首先判断,是在微信中打开还是非微信打开,非微信打开,创建订单式,判断选择支付宝支付,还是微信支付支付宝支付:请求后端给的api,传入订单号,或者你们自定义的参数,然后请求成功后返回的地址是后端直接配置的,支付成功后跳转相应的界面,注意:判断有无支付宝app,是支付宝自己的界面测试地址 :https://wxh5.hyxhbao.com/home //支付宝app支付 this.$api.order .payWithAlipayH5({ o原创 2020-12-16 11:37:34 · 1214 阅读 · 1 评论 -
vue h5项目自定义audio组件,进度条可拖拽
思路:先按照原生audio组件,将如何控制播放暂停写出来,通过相关属性获得当前播放时间以及总时长,然后难点在于如何实现进度条的拖拽,控制时间的显示。相关拖拽: // touchstart 触摸开始,多点触控,后面的手指同样会触发 // touchmove 接触点改变,滑动时 // touchend 触摸结束,手指离开屏幕时 // touchcancel 触摸被取消,当系统停止跟踪触摸的时候触发全部代码<template> <div> .原创 2020-12-10 18:30:13 · 2265 阅读 · 4 评论 -
前端将后台返回来的csv数据导出成csv文件
页面展示后端后端返回数据原创 2020-08-14 18:07:41 · 970 阅读 · 1 评论 -
vue返回上一页面时记忆当前位置,返回回到原先滚动的位置
因为vue是单页面应用,进入其他页面时会销毁该页面,用keep-alive不让其刷新,具体实现为:在App.vue中加入:index.js页面这样在index.vue中,mounted方发只走一次,在浏览器上实现了返回原来滚动位置的目的。但是在手机上测试,发现没用,解决手机上实现目的的方法:版权声明:本文为CSDN博主「全易」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转...原创 2020-03-02 09:32:32 · 1808 阅读 · 0 评论 -
vue 打包背景图片不显示问题,出现Failed to load resource: net::ERR_FILE_NOT_FOUND,解决
if (options.extract) {return ExtractTextPlugin.extract({use: loaders,fallback: ‘vue-style-loader’,publicPath: ‘…/…/’ //背景图片位置})} else {return [‘vue-style-loader’].concat(loaders)}...原创 2019-11-14 16:47:23 · 3387 阅读 · 0 评论 -
Vue项目打包报错Failed to load resource: net::ERR_FILE_NOT_FOUND
打包出错显示空白页,或者Failed to load resource: net::ERR_FILE_NOT_FOUND1.webpack.prod.conf.js 中output添加参数publicPath:'./'2.修改webpack.base.conf.js中:publicPath: process.env.NODE_ENV === 'production'?'....原创 2019-11-04 10:32:57 · 30111 阅读 · 9 评论 -
封装 vue axios 方法。通过引入 api/模块.js 调用方法与后台对接口,实现页面的渲染
import axios from 'axios'import store from '@/store/index'import Vue from 'vue'import { Toast } from 'vant';Vue.use(Toast);const service = axios.create({baseURL: '', // api 的 base_url proc...原创 2019-08-23 18:48:48 · 1099 阅读 · 0 评论 -
vue + webpack + px2rem 把px自动转为rem
1.下载lib-flexiblenpm i lib-flexible --save2.在index.html中<html data-dpr = '1'>在common.css中写html {font-size: 10vw;}3.设置meta标签<meta name="viewport" content="width=device-wid...原创 2019-07-15 14:41:25 · 253 阅读 · 0 评论 -
Vue2.0 $set() v-model.trim
受 ES5 的限制,Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter,所以属性必须在 data 对象上才能让 Vue.js 转换它,才能让它是响应的。要处理这种情况,我们可以使用$set()方法,既可以新增属性,又可以触发视图更新。this.$set(this.data,”key”,value’)mounte...原创 2019-07-04 14:21:13 · 2991 阅读 · 0 评论 -
vue相关
1、active-class是哪个组件的属性?嵌套路由怎么定义?答:vue-router模块的router-link组件。 2、怎么定义vue-router的动态路由?怎么获取传过来的动态参数? 答:在router目录下的index.js文件中,对path属性加上/:id。 使用router对象的params.id 3、vue-router有哪几种导航钩子? ...原创 2018-11-19 11:45:03 · 173 阅读 · 0 评论 -
vue需要知道的问题
1、active-class是哪个组件的属性?嵌套路由怎么定义?答:vue-router模块的router-link组件。2、怎么定义vue-router的动态路由?怎么获取传过来的动态参数? 答:在router目录下的index.js文件中,对path属性加上/:id。 使用router对象的params.id3、vue-router有哪几种导航钩子? 答:三种,一种是全局导航钩子:...原创 2018-11-27 10:12:20 · 737 阅读 · 0 评论 -
vue组件进度条
效果图<template> <div class="progressContainer"> <b class="b1">涨{{progress}}%</b> <div class="progress" :style="{width:progress+'%'}">原创 2018-12-12 17:00:45 · 754 阅读 · 0 评论 -
vue- 封装选项卡切换
<template> <ul> <li v-for="(item, index) in navTabList" :key="index" @click="get(index)" :class="{active:index == num}">{{item}}</li> </ul&g原创 2019-01-21 11:34:51 · 564 阅读 · 0 评论 -
vue 实现显示与隐藏
vue 实现显示与隐藏// An highlighted block<template> <div> <header-top> <span slot="title" class="name">版本更新</span> </header-top> <div class="h_co...原创 2019-05-30 15:51:06 · 5999 阅读 · 0 评论 -
vue 显示与隐藏,点击显示一个
<template><div><header-top><span slot="title" class="name">版本更新</span></header-top><div class="h_con"><div class="h_question"><div v-fo...原创 2019-05-30 15:53:10 · 3208 阅读 · 0 评论 -
vue+croppr.js 裁剪圆形图片
<template><div id="demo"><!-- 遮罩层 --><div class="container" v-show="panel"><div><img id="image" :src="url" alt="Picture"></div><button typ...转载 2019-06-14 10:39:01 · 4543 阅读 · 4 评论 -
“vue学习笔记&购物车的实现”
“vue学习笔记”学习网站:1.https://cn.vuejs.org/v2/guide/2. http://www.runoob.com/vue2/vue-tutorial.html下载vue.js方法1:http://unpkg.com/[email protected]/dist/vue.js方法2:gitup下载2.入门操作:<!DOCTYPE html><htm...原创 2018-11-15 16:04:50 · 163 阅读 · 0 评论