vue - 循环出来的 el-input 无法输入
<!--循环出来的-->
<el-input
v-model.trim="child.value"
@input="forceUpdate"
:clearable="true"
type="text"
maxlength="20"
placeholder="请输入"
/>
// 强制重新渲染
forceUpdate () {
this.$forceUpdate()
}
<!--循环出来的-->
<el-input
v-model.trim="child.value"
@input="forceUpdate"
:clearable="true"
type="text"
maxlength="20"
placeholder="请输入"
/>
// 强制重新渲染
forceUpdate () {
this.$forceUpdate()
}
通过 props 传递给子组件的 值,不能在子组件内部修改 props 中的 值,可以通过 this.$emit 来操作。
// js 取父窗口的元素
window.parent.document.getElementById("idName");
// jquery 取父窗口的元素
$('#idName', window.parent.document);
// jquery 取父窗口的父窗口的元素
$('#idName', window.parent.parent.document);
// 内容是否有修改
// true:未改变;false:改变了
isChange() {
if(this.Compare(this.dialog.detail.form, this.dialog.detail.oldForm)){
console.log('未改变');
}else{
console.log('改变');
}
return this.Compare(this.dialog.detail.form, this.dialog.detail.oldForm);
},
/**************************************比较json-start***************************************/
isObj(object) {
return object && typeof(object) == 'object' && Object.prototype.toString.call(object).toLowerCase() == "[object object]";
},
isArray(object) {
return object && typeof(object) == 'object' && object.constructor == Array;
},
getLength(object) {
var count = 0;
for(var i in object) count++;
return count;
},
CompareObj(objA, objB, flag) {
for(var key in objA) {
if(!flag) //跳出整个循环
break;
if(!objB.hasOwnProperty(key)) {
flag = false;
break;
}
if(!this.isArray(objA[key])) { //子级不是数组时,比较属性值
if(objB[key] != objA[key]) {
flag = false;
break;
}
} else {
if(!this.isArray(objB[key])) {
flag = false;
break;
}
var oA = objA[key],
oB = objB[key];
if(oA.length != oB.length) {
flag = false;
break;
}
for(var k in oA) {
if(!flag) //这里跳出循环是为了不让递归继续
break;
flag = this.CompareObj(oA[k], oB[k], flag);
}
}
}
return flag;
},
Compare(objA, objB) {
if(!this.isObj(objA) || !this.isObj(objB)) return false; //判断类型是否正确
if(this.getLength(objA) != this.getLength(objB)) return false; //判断长度是否一致
return this.CompareObj(objA, objB, true); //默认为true
},
/**************************************比较json-end***************************************/
mounted() {
console.log('mounted');
let that = this;
window.addEventListener('scroll', function (e) {
that.scrollFunc();
}, true);
},
destroyed() {
window.removeEventListener('scroll', this.scrollFunc);
},
methods: {
scrollFunc() {
// let header = document.getElementsByClassName('has-gutter')[0];
let header = $('.has-gutter');
let header_offset = header.offset();
let header_top = +header_offset.top + 50;
if(this.select === undefined || this.select === null || this.select === ''){
return false;
}
let ref = this.$refs[this.select.id][0] || null;
$('.el-select-dropdown').each(function (e) {
if($(this).css('display') === 'none'){
}else{
let el_select_dropdown = this;
let el_select_dropdown_offset_top = el_select_dropdown.offsetTop;
if(+el_select_dropdown_offset_top <= +header_top){
console.log('小于了');
ref && ref.blur();
// $(this).css('display', 'none');
// ref.$refs.input.blur();
}
}
});
},
}
let keyboardDiv = document.getElementsByClassName('keyboard-container')[0];
let keyboard_offsetTop = keyboardDiv.offsetTop;
console.log('键盘高度:' + keyboard_offsetTop);
let wHeight = +keyboard_offsetTop + 270;
let signId = item.signId;
let inputId = 'input-' + signId;
let inputDiv = document.getElementById(inputId);
let ref = this.$refs[inputId][0];
let input_top = ref.$el.getBoundingClientRect().top;
#test a:hover {
text-decoration: none;
background: url("http://xiaowiba.com/demo/svg/test-ahover.svg")
repeat-x 0 100% !important;
background-size: 20px auto !important;
animation: waveMove 1s infinite linear !important;
}
.el-select-dropdown {
top: 50px !important;
left: 0 !important;
}
#lineTd {
width: 200px;
color: #000000;
font-size: 30px;
text-align: center;
font-weight: 100;
border-bottom: 1px solid #6BA1FF;
height: 130px;
box-sizing: border-box;
text-indent: 0;
background: linear-gradient(33deg, transparent 49.5%, #CDD4F3 49.5%, #CDD4F3 50.5%, transparent 50.5%);
}