Vue.之. 动态设置按钮Disabled
添加了一个 属性 :disabled="isAble"
el-switch 初始值(默认值)不能正确显示状态问题
https://www.cnblogs.com/xuxiaoyu/p/13202339.htmlhttps://www.cnblogs.com/xuxiaoyu/p/13202339.htmlhttps://www.cnblogs.com/xuxiaoyu/p/13202339.html【active-value="1" inactive-value="0"】,此时的【active-value】值类型为string,如果要求【active-value】值类型为number时,必须在其前面加上【 : 】 :active-value="1" :inactive-value="0"
Vue使用v-for与v-if搭配满足条件进行赋值,和v-if三目表达式的使用
Vue使用v-for与v-if搭配满足条件进行赋值,和v-if三目表达式的使用_Java小皮孩-CSDN博客
vue 主动失去焦点
vue中主动失去焦点_old_hu的备忘录-CSDN博客_vue 失去焦点https://blog.csdn.net/weixin_43565820/article/details/102696740
关于解决el-select组件自动清除数据空格的问题
关于解决el-select组件自动清除数据空格的问题_string佳佳的博客-CSDN博客用el-select组件渲染ydlbmc字段,数据里面有空格,但是渲染上去的时候空格被组件自动清除了解决方法一:在拿到数据的时候循环数组对象,把ydlbmc字段的空格替换成"   ;",并使用v-html来解析数据<el-select v-model="selForm.ydlbValue" clearable placeholder="请选择"> <...
https://blog.csdn.net/weixin_44171757/article/details/99410574
element-ui $prompt输入弹框和$confirm确认弹框用法&输入校验
this.$prompt(
'请输入文件夹名称:',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: '输入框默认值',
inputErrorMessage: '输入不能为空',
inputValidator: (value) => { // 点击按钮时,对文本框里面的值进行验证
if(!value) {
return '输入不能为空';
}
},
// callback:function(action, instance){
// if(action === 'confirm'){
// // do something...
// console.log(instance.inputValue);
// }
// }
}).then(({value}) => {
console.log(value);
// TO DO DO ...
}).catch((err) => {
console.log(err);
});
使用this.$prompt弹窗判断手机号码数量验证
this.$prompt('请输入手机号码或座机号', '客服电话', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValidator: (val) => {
if (val === null) {
return true;
}
return !(val.length > 11 || val.length < 11)
},
inputErrorMessage: '格式不正确'
}).then(function (action) {
console.log(action);
}).catch(function (cancel) {
console.log(cancel);
})
Vue的$confirm确定框提示内容换行显示
vue.js click点击事件获取当前元素对象
Vue.js可以传递$event对象
<body id="app">
<ul>
<li v-on:click="say('hello!', $event)">点击当前行文本</li>
<li>li2</li>
<li>li3</li>
</ul>
<script>
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
},
methods: {
say: function(msg, event) {
//获取点击对象
var el = event.currentTarget;
alert("当前对象的内容:"+el.innerHTML);
}
}
})
</script>
</body>
elementui中el-button点击后强制失去焦点(this.$confirm取消后按钮聚焦问题)
clickHandler(evt) {
let target = evt.target;
if(target.nodeName == "SPAN"){
target = evt.target.parentNode;
}
target.blur();
}
vue cookie
el-date-picker如何设置disabled(picker-options)属性
【vue】页面不刷新情况下修改url参数
纯js中使用Message、MessageBox的方法
import { Message } from 'element-ui'
import { MessageBox } from 'element-ui'
Message({
message: res.message || 'Error',
type: 'error',
duration: 5 * 1000,
onClose: () => {
errorMessage = ''
}
})
MessageBox.alert(res.message + ',当前页面将关闭!', '提示', {
confirmButtonText: '确定',
callback: action => {
store.dispatch('user/logout')
return
}
})
使用el-button的时候,发现点击按钮后,按钮颜色仍然保持鼠标悬浮上去时候的效果,并没有恢复到正常状态
解决方法:
clickHandler(evt) {
let target = evt.target;
if(target.nodeName == "SPAN"){
target = evt.target.parentNode;
}
target.blur();
}
-----------------------------------时间格式化函数-----------------------------------------------
methods{// 时间格式化
dateFormat:function(time) {
var date=new Date(time);
var year=date.getFullYear();
/* 在日期格式中,月份是从0开始的,因此要加0
* 使用三元表达式在小于10的前面加0,以达到格式统一 如 09:11:05
* */
var month= date.getMonth()+1<10 ? "0"+(date.getMonth()+1) : date.getMonth()+1;
var day=date.getDate()<10 ? "0"+date.getDate() : date.getDate();
var hours=date.getHours()<10 ? "0"+date.getHours() : date.getHours();
var minutes=date.getMinutes()<10 ? "0"+date.getMinutes() : date.getMinutes();
var seconds=date.getSeconds()<10 ? "0"+date.getSeconds() : date.getSeconds();
// 拼接
return year+"-"+month+"-"+day+" "+hours+":"+minutes+":"+seconds;
},
}
--------------------------vue.js click点击事件获取当前元素对象----------------------------
Vue.js可以传递$event对象
<body id="app">
<ul>
<li v-on:click="say('hello!', $event)">点击当前行文本</li>
<li>li2</li>
<li>li3</li>
</ul>
<script>
new Vue({
el: '#app',
data: {
message: 'Hello Vue.js!'
},
methods: {
say: function(msg, event) {
//获取点击对象
var el = event.currentTarget;
alert("当前对象的内容:"+el.innerHTML);
}
}
})
</script>
</body>
-----------Vue的$confirm确定框提示内容换行显示-------------------------------------
Vue的$confirm确定框提示内容换行显示_ChuaWi98的博客-CSDN博客
XXXfunction(status){
let confirmText = [];
if (status === 2) {
confirmText = ['是否发布该活动?', '注意:活动发布后允许查看,但不可再编辑!']
}else if (status === 3) {
confirmText = ['是否停止该活动?', '注意:活动停止后允许查看,但不可再发布!']
}
const newDatas = []
const h = this.$createElement
for (const i in confirmText) {
newDatas.push(h('p', null, confirmText[i]))
}
this.$confirm(
'提示',
{
title: '提示',
message: h('div', null, newDatas),
showCancelButton: true,
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
… …
})
}
------element-ui $prompt输入弹框和$confirm确认弹框用法&输入校验-------------
this.$prompt(
'请输入文件夹名称:',
'提示',
{
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: '输入框默认值',
inputErrorMessage: '输入不能为空',
inputValidator: (value) => { // 点击按钮时,对文本框里面的值进行验证
if(!value) {
return '输入不能为空';
}
},
// callback:function(action, instance){
// if(action === 'confirm'){
// // do something...
// console.log(instance.inputValue);
// }
// }
}).then(({value}) => {
console.log(value);
// TO DO DO ...
}).catch((err) => {
console.log(err);
});
this.$prompt('请输入手机号码或座机号', '客服电话', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValidator: (val) => {
if (val === null) {
return true;
}
return !(val.length > 11 || val.length < 11)
},
inputErrorMessage: '格式不正确'
}).then(function (action) {
console.log(action);
}).catch(function (cancel) {
console.log(cancel);
})
el-date-picker如何设置disabled(picker-options)属性
vue cookie
v-model和computed结合使用 vue。v-model指向方法
v-model和computed结合使用 vue_随意花的博客-CSDN博客_computed v-model
import 引入要不要花括号
如果不是export default function
,那么在引用的时候应该写成import { XXX } from 'xxxxxxx'
如果是export default function
,那么在引用的时候应该写成import XXX from 'xxxxxxx'