vue 监听数值的变化,并捕捉到 上传头像的例子是完整的,登录没全部展示1. 封装全局监听方法:在main.js中给引入watchsessionStorage(可以放多个函数)。约定监听的sessionStorage的值为"dialogLogin",“avatarUrl”,然后创建StorageEvent方法,当执行sessionStorage.setItem(k, val) 时,初始化事件,并派发事件//用于登录判断是否有tokenexport function resetSetItem(key, newVal) { if
vue 项目引入 字体文件 亲测无误,不会报错第一步第二步/* 引入字体 */@font-face { font-family: 'FZCHYJW'; src: url('FZCHYJW.ttf'); font-weight: normal; font-style: normal;}@import "./font.css";使用font-family: 'FZCHYJW';效果图...
css3 图片旋转 关键代码//数值越大,转速越缓慢(30s) animation: rotate 30s linear infinite; @keyframes rotate { 0% { -webkit-transform: rotate(0deg); } 25% { -webkit-transform: rotate(90deg); } 50% { -webkit-transform: rotate(180deg); } 75% { -webk
vue 答题(单选,多选,判断) 这里是后台处理得计分,前台这是渲染题目,以及回显用户答得题答题后台数据格式 <ul> <li v-for="(i, index1) in arrlist.pqList" :key="index1"> <h3> <span>{{ index1 + 1 }}、</span> <div class="newtuexam_box">
vue el-radio和 el-checkbox样式修改 el-radio /deep/ .el-radio { margin-bottom: 15px; } /deep/ .el-radio__inner:hover { border-color: #ffdc82; } /deep/ .el-radio__label { color: #ffdc82; font-size: 20px; } /deep/ .el-rad
css3 文字竖着排列,且有间距 writing-mode:horizontal-tb;//默认:水平方向,从上到下 writing-mode:vertical-rl; //垂直方向,从右向左writing-mode:vertical-lr; //垂直方向,从左向右letter-spacing来设置字与字间距_字符间距离,字体间距css样式text-indent设置抬头距离css缩进 i { writing-mode: vertical-rl; margin-top: 48px;
css奇怪布局(一) css 奇怪布局(思路)记录日常布局这个布局时有一个底部背景图,不能遮挡li标签。这边做了.newtustudy(父亲) 相对定位。.newtustudy_bg 线条背景图绝对定位在底部, z-index: 0;ul { padding-bottom: 1200px;} 1200px是 .newtustudy_bg的高度。最后一个li标签绝对定位,且 z-index: 1;<template> <div class="newtustudy">
Vue禁止自动填充浏览器用户名密码 readonly onfocus="this.removeAttribute('readonly')"<el-input readonly onfocus="this.removeAttribute('readonly')" type="password" v-model="passForm.newPassword" show-password placeholder="请输入密码" @input="$forceUpdate.
el-upload在列表里使用 el-upload 数组得新增删除 <el-upload ref="upload" :action="uploads.url + '?baseDir=' + uploads.baseDir" :headers="uploads.headers" :on-success=" handleUploadSuccess2.bind(null, { index: i, data: ite
pc端检测本地电脑是否安装某应用,安装则打开反之则下载(vue 脚手架3) vue使用protocolCheck需要全局引入**在需要得页面使用这个方法我的需求是1.电脑未下载,调用后台拿到路径用window.href下载到本地2 电脑已下载,弹出浏览器自带得框** window.protocolCheck( 'u3d://', (fail) => { console.log('fail', fail) // 没有安装 弹窗显示 引导去下载
css 毛玻璃 <main> <p>IOS版下载</p> </main> main { position: absolute; top: 584px; left: 300px; width: 225px; height: 200px; line-height: 2; border-radius: 20px; background: rgba(255, 255, 255, 0.05); backdrop-fi.
解决 element 输入框无法输入问题 强制刷新@input="$forceUpdate()"<el-input v-model="passForm.passworda" @input="$forceUpdate()" placeholder="请输入密码"></el-input><el-select v-model="addForm.deptMajorId" @change="getaddSelect4" @input="$forceUpdate()"placeholder="请选择专业名称">
el-input的rules验证 <el-form :model="registerForm" :rules="registerrules" ref="registerForm" > <el-form-item prop="mobile"> <el-input v-model.number...
vue 监听sessionStorage存值的变化 在main.js进行路由监听,点击其他页面如果是未登录得状态,弹出登录页面main.jsimport { resetSetItem} from "@/utils/watchsessionStorage";//路由拦截router.beforeEach((to, from, next) => { if (to.meta.requireAuth) { // 判断该路由是否需要登录权限 // console.log(to.meta.requireAuth); // conso
vue 实现导出文件 安装 npm install file-saver --save建立exportFile.js在utilsimport FileSaver from "file-saver";export default class fileSave { /** * 导出Excel文件 * @param {*} res 文件流 * @param {*} name 文件名 */ static getExcel(res, name) { le
vue 使用百度地图(全景图) 安装 vue-baidu-map vue-jsonp第一步npm install vue-baidu-map --savemain.jsimport BaiduMap from 'vue-baidu-map'// 百度地图 Vue.use(BaiduMap, { ak: '' // 自己的百度地图ak})第二步 <baidu-map class="map" :center="center" :zoom="zoom" @ready="handler">
vue 根据楼层数为7,生成一个7条数据的表格 原型图当用户输入楼层数,出现对应数量数组 getinput() { this.num = Number(this.formone.floorA); this.arrlist = []; for (var i = 0; i < this.num; i++) { this.arrlist.push({ layer: i + 1, houseld: 0, share: 0,