前端笔记
关注
分享
扫一扫
vue，js
Bcc的笔记
2015年开始在搜狐畅游实习，2016年毕业，目前在抖音为直播业务保驾护航，欢迎加入我们
展开
-
js中表单验证中的任务执行顺序初探
在写线上运维平台中的表单处理逻辑时，遇到困扰的地方//验证表单 checkForm(){ return new Promise((resolve, reject) => { var checkResult=true this.$refs['businessInfo'].val...原创 2020-07-28 19:50:00 · 201 阅读 · 0 评论 -
通过引用组件实现左菜单栏
前端样式使用了iview的布局组件控制左菜单栏的前端主父组件代码<template> <div id="Home"> <Layout :style="{minHeight: '100vh'}" > <Sider collapsible :collapsed-width="78" v-mod...原创 2020-07-15 10:20:00 · 96 阅读 · 0 评论 -
mac 安装vue 调试插件：vue-devtools
下载项目到本地某个目录下vue-devtools项目地址解压后进入到目录执行npm installnpm run build 将其添加到chrome的扩展程序点击选择shells/chrome 即可导入成功重启chrome，打开自己的项目就可以看的vue插件...原创 2020-07-14 20:23:00 · 587 阅读 · 1 评论 -
列表过滤功能
功能场景：从后端获取所有的数据并渲染到表格后，需要对这些数据进行查找筛选实现的前端demoinput标签绑定数据 keyword<Row> <Col span="4"> <Input v-model="keyword" search enter-button placeholder="输入关键字，支持topic名/申请人/部门" /&g...原创 2020-07-14 21:15:00 · 246 阅读 · 0 评论 -
vue 报错：please transfer a valid prop path to form item
前端项目编译报如下错误，这两处其实是一处的报错查看第二处报错信息中对应的getProByPath函数可以大概知道是解析prop属性指定的路径时找不到触发的报错，由于prop是用于设置一些规则的属性所以遇到这种报错就需要看下代码中prop指定的路径是否在rules中存在我触发报错的原因是因为表单中的prop中指定的causesAndNeeds被我从rules规则中删除了，解决...原创 2020-07-13 21:04:00 · 3532 阅读 · 0 评论 -
iview 动态实现增减输入框
前端模版要点说明(仅是自己在调试中总结的个人理解，非官方，认知有限)v-model是用来绑定数据的，和数据结构中的字段名保持一致，否则无法取得数据prop和和v-model的字段名相同，由于这里是动态生成input标签，所以prop属性也应该是动态的，因为rules是根据prop来校验的，所以rules在formItem域中单独设置如果设置了非空的规则，输入数据后检查不通过，则...原创 2020-06-14 17:45:00 · 803 阅读 · 2 评论 -
vue 表单验证由异步变更为同步
写前端项目时vue表单验证突然变成异步了，导致如果获取校验函数的返回值，应该是升级iview组件导致的，这里记录一下改为同步的一种写法实现功能：表单中进行规则设置，当触发提交或者流程中的下一页时触发这些规则校验表单<Form ref="businessInfo" :model="businessInfo" :rules="businessInfoRule" :label-w...原创 2020-07-08 17:22:00 · 2960 阅读 · 0 评论 -
jinjia2 遍历追加语法
实现将遍历的元素按照规则进行拼接如果是组内的变量需要通过set获取如果是全局的变量可以直接通过{{variable}} 引用如果在for循环中通过{% set dirs = dirs+/home/disk"+n|string+"/kafka"%}，变量只在for循环内可见，所以使用append解决此问题；但是append会产生换行符，所以在配置文件中会有很多空行，有知道解决办法的...原创 2020-06-03 20:05:00 · 472 阅读 · 0 评论 -
vue 实现从后端获取数据渲染选择框
前端环境：vue使用的vue 组件：iview后端项目框架：beego实现功能：从数据库中读取数据绑定到选择菜单栏前端定义请求的路由地址文件：src/api/demands.js// 获取集群列表export const getClusterList = ()=>{ return SiodAxios.request( { url: baseU...原创 2020-06-30 17:35:00 · 2235 阅读 · 0 评论 -
vue项目重编译失败
问题触发背景本地测试项目没有问题后上传到gitlab，然后拉到测试机上开始npm run dev，结果报错解决方法项目根目录下创建文件：postcss.config.jsmodule.exports = { plugins: { 'autoprefixer': {browsers: 'last 5 version'} } }...原创 2020-06-24 14:42:00 · 719 阅读 · 0 评论