yongyafang123的博客

vue 左侧展示隐藏菜单栏 collapse类似

el-input 回车键、字体输入问题

heroicons vue tailwindcss

问题：我在输入框输入的时候，每输入一次，输入框就自动失去焦点了。ps：实现的功能是，一个列表组件，每个对象中都有一个input输入框。<div class="addTags" v-for="(item,index) in list" :key="item.title"> <input type="text" v-model="item.title"> </div>原因问题在于:key=‘item.title’，input数据也通过v-model="i

Vue相关Vue相关

在package.json中配置打包路径：1、在scripts中定义打包指令；指令说明： --target lib 关键字 指定打包的目录–name 打包后的文件名称–dest 打包后的文件夹的名称例如：“sf_common_build”: "node build/build.js --target lib ./src/ui/index.js --name qf-ssf --dest com_ss3种方式：1、npm本地file引用：在项目控制台下输入 npm install …/com

问题：vue的项目 在iOS内嵌中运行时， 返回上一页 页面上半部分出现空白！但点击或者滑动，页面就回复正常了。原因：由于返回后无法将 body 的高度拉开，使得遮住，触发轻点击，方可消除遮罩针对此问题。html、body都是100%，#app撑起了父元素的高度，但是浏览器默认的滚动scroll并不是#app，而是body。某些因素，造成返回history 后，无法复原，为此，我们将#app 进行了绝对定位，并让它重新成为 scroll 的对象，从而解决问题网上解决方案：html,body{

1、Vue安装ossnpm install ali-oss2、新建js文件alioss.js 内容如下（可直接复制）var OSS = require('ali-oss')export function client () { var client = new OSS({ region: 'oss-cn-hangzhou', accessKeyId: 'ID 运营会给你', accessKeySecret: '密钥 运营会给你', bucket: '阿里云

需求：在父组件的一个事件可以改变子组件中的 openData 的值变为 true。废话不多说，直接上代码：父级页面：<template> <div> <div @click="changeChild">按钮改变子组件数据</div> <children ref="childrenDom"></child...

**需求：**同一个页面，可以根据后台返回的颜色值，改变页面的色调方式无需多言 直接上代码<template> <div class="theme" :style="colorProps"> <div class="btn"> <div class="class1">我的字体颜色是红色的...

**1、vue swiper回调函数内传值到vue数据内**vue swiper回调函数内传值到vue数据，不能直接用this，因为this指向的是当前swiper，所以需要在data内 定义self指向this如下：data() { let self = this return { currentIndex: 0, swiperOption:{ on: {...

使用场景：当某一个页面中有2个以上的图片，然而有一个事件（比如 截屏）是必须要在页面中的图片都加载完了之后才可以去执行的！否则的话，就不会截到我们想要的屏幕原理：img的load事件<img @load=‘loadImg’ src="" />做法：以下是步骤：1、把页面中的所有图片都加上@load事件；2、编写事件：（变量加一，判断条件去执行方法）loadImageO...

本来要写一个音频播放的倒计时圆圈⭕️动效；很庆幸，vant里面有提供！贼开心然后就算音频时间，对应圆圈转动速度，很完美的写完了！可是第二天测试人员给我反馈说，iOS11的手机进度圆圈错位了！ what 什么鬼 为什么为什么这也没有什么的单独设置啊结果一顿百度啊！最终找到了答案谁能想到和全局设置字体样式有关， postcss-pxtorem在node_modules —— p...

1、在项目中安装组件： npm install crypto-js --save-dev2、在utils文件夹中新建一个crypto.js文件内容如下：（小伙伴们复制即可）/** * 工具类 */import CryptoJS from 'crypto-js'export default {// 加密 encrypt (word, keyStr) { // word, keySt...

问题描述：在写页面过程中有时子组件需要获取到父组件请求获得的数据后才能显示（比如：百度富文本的引用，回显数据的时候）想了很多办法 最后看到这种比较可行，方便<UE :defaultMsg=activityForm.introduction v-if="activityForm.introduction" :config=config ref="ue"></UE>及...

解决方案为三个地方，三个地方缺一不可：1、html2canvas.js源码中修改两个地方：(如果是Vue项目在：node_modules—html2canvas—dist—html2canvas.js) case 2: Logger.getInstance(this.id).debug("Added image " + key.subst...

好不容易Vue项目引用百度富文本成功了，在测试环境都没有任何问题，于是就打包提交项目吧！我天 问题出现了，报百度富文本的引用包报错，找不到路径！一脸懵，百度各种方式都试了 都不对症，，，最后想到了引用文件的地方修改了一下相对路径 就完美解决了 记录一下：...

vue项目引入highcharts步骤：第一步:安装 highcharts 命令如下：npm install highcharts --save第二步：编写公用的组件： 在src ------> components (组件目录下)新建 charts.vue 页面代码如下：<template> <div class="x-bar"> ...

项目中有出现需要输入内容的时候，input框有时候会无法输入进去，感觉像是被禁用了！代码如下:<el-input type="textarea" v-model="ruleForm.text"></el-input>发现elementUI中@input事件可以拿到当前输入的值，问题找到了，视图没有更新的问题解决方法 this.$forceUpdate()即改为...

之前写页面考虑不到什么占位图，这次UI设计都有一个占位图，不得不逼着自己更准确的考虑图片显示错误时的情况！1、期初，想着用背景来填充，如果图片显示则就自然而然的把背景图遮盖住了，可实际情况是，如果后台返回的图片有误不显示时，背景图上面还是会有一个破损的小图片显示不美观；background: url("../../../static/images/avaterSpaceMap.png");b...

问题描述：axios请求 get请求没有问题，但是post后台返回200但是就是接收不到数据；第一步：安装qsnpm install qs第二步：在封装接口中引用并在post中运用；import axios from 'axios'import qs from 'querystringify'export function post (url, data = {}) { r...

下面说两种情况：1、data中定义的图片，页面中显示时 ,应该这样定义： iconImg: require('../../static/img/tab1Gray.png')；2、页面中动态获取的静态图片也要注意；<img v-if="index<3" :src='../../static/images/no' + index + '.png' />上面的真机上显示不...

出现问题：vue项目本地运行正常，npm run build之后，将dist文件上传至服务器之后，访问域名出现 .js 、.css等静态资源文件访问404，导致访问页面空白。分析原因：路径不对，找不到对应的status文件夹，有两种修改方式，一种是修改为相对路径，一种是修改为绝对路径。以相对路径为例 解决方案：将 ’ / ’ 改成 ’ ./ ’ 然后重新打包部署，访问就可以了...

1. 页面中字体适配的方法：新建一个rem.js文件：const baseSize = 32function setRem () { const scale = document.documentElement.clientWidth / 750 document.documentElement.style.fontSize = (baseSize * Math.min(scale,...

一般冒泡Vue行为即可用stop解决，如下<div id="box"> <div @click="show2()"> <input type="button" value="按钮" @click.stop="show()"> </div></div>阻止事件默认行为：<div id="box...

*** ## 项目中问题： ***在购物车管理界面，可以选中复选框进行结算，但是切换到完成界面， 复选框就选不中，但是显示的数据是已经改变了，就是页面没渲染！*** ## 解决方法： ***运用 this.$forceUpdate() 强制刷新（因为数据层次太多，需手动强制刷新。）...

vue vant插件中 轮播图组件在手机上有时不能手势滑动，安卓手机好像没有问题 iOS手机会时不时的能滑 不能划的情况出现！不知道是什么鬼！难道是组件问题 有知道原因的可以留言。后面我用Vue 中 vue-awesome-swiper插件来替换vant了 暂时没有出现问题...

点击按钮 跳转链接window.location.href = 'tel:18505365925'

**为每一个界面设置title 即使用vue-router设置每个页面的title**使用vue-router设置每个页面的title：步骤如下进入 router 文件夹底下的index.js文件 引入：import Vue from 'vue'import Router from 'vue-router'然后在路由里面写路由的时候配置每个路由的地址 meta中 title：...