1、解决循环数组对象覆盖问题,有时循环一个数组push对象后,数组会是重复的最后一个对象,前面的被覆盖了
tabArr.forEach((item, index) => {
let lastSort = lastSort + 1 //排序加1
obj = { value: index, text: item, sort: lastSort } //加上sort属性为了每次循环创建是一个新对象,解决对象被覆盖的问题。
tempArr.push(obj)
})
2.vue中select框与输入框赋默认值时,不生效
在select组件中绑定change事件,change事件中调用$forceUpdate()强制刷新
3.如果使用router-link标签,加上@click事件,绑定的事件会无效
因为router-link的作用是单纯的路由跳转,会阻止click事件, 此时在click后面加上.native,才会触发事件。
4.post方法传参,后台参数放在form-data中,请求接口会报错
方法:要序列化请求参数,安装一个qs序列化插件,imort引入页面,qs.stringify(请求参数)
5.ant-design-vue中日历组件a-date-picker 禁用每周具体某天或者某几天
v-model="startValue"
format="YYYY-MM-DD"
placeholder="执行周期开始时间"
style="width: 49.2%"
:disabled-date="disabledStart"
@change="changeTime"
/>
disabledStart(val) {
return new Date(val).getDay() !== 4
},
6.vue前端本地导出
下载vue-json-excel插件
import JsonExcel from 'vue-json-excel'
components: { JsonExcel },
class="export-btn"
:data="dataSource"
:fields="jsonFields"
type="xls"
header="影院列表"
:name="excelName"
>
dataSource与jsonFields在data()中定义;dataSource是列表数组,jsonFields里面表头与对应字段名称
jsonFields: {
//导出Excel表格的表头设置
匹配结果: {
callback: (value) => {
return value.matchResult == 'normal'
? '正常'
: value.matchResult == 'disabled'
? '已禁用'
: value.matchResult == 'expired'
? '已到期'
: ''
},
},
//影院编码: 'cinemaCode',
影院编码: {
callback: (value) => {
return ' ' + value.cinemaCode + ' '
},
},
影院名称: 'cinemaName',
厅数量: 'hallNum',
采购时长: 'adDuration',
服务方式: {
callback: (value) => {
return value.serviceType == 'auto'
? '线上自动'
: value.serviceType == 'manu'
? '线上手动'
: value.serviceType == 'manualOffline'
? '线下手动'
: ''
},
},
},