Home > front end >  Could you tell me how to form embedded checkbox set v - model variables
Could you tell me how to form embedded checkbox set v - model variables

Time:11-01

Situation is that each row in the table column is a check box, line is according to the dynamic increase of query, column is fixed, now I don't know how to give the checkbox of the v - model bind variables, binding common variable selected a whole row is selected, I was a rookie vue and element to school for a short time, for which a great god solve, see a great god write posts a variable is a [[]] in the form of a completely don't understand what mean

CodePudding user response:

In access to data, add an attribute to each data, is set to false, said is not selected, then traverse data bind them to the checkbox, vue will help you keep track of its change

New rule of thumb

CodePudding user response:

A set of binding v - same model will obtain an array, the initial value is [] to array
https://element.eleme.cn/#/zh-CN/component/checkbox#checkbox-button-attributes

Can use the dynamic new lines of v - an attribute model is bound to the checkbox

CodePudding user response:

Part of the code is
 






to achieve the effect of the above

CodePudding user response:

V - week12 there don't know what to write variables in the model

CodePudding user response:

refer to three dozen soy sauce 2 floor response:
v - a group of the same binding model will obtain an array, the initial value will give array []
https://element.eleme.cn/#/zh-CN/component/checkbox#checkbox-button-attributes

Can use the dynamic new lines of v - an attribute model is bound to the checkbox
don't understand, can give you an example

CodePudding user response:

Users add week1 - week12 collections of objects, and then use the scope. The row. The week1 binding

CodePudding user response:


 & lt; body> 







 new Vue ({
El: '# app,
Data: the function () {
Return {
TableData: [{
Name: '1 king tiger,
Week1: false,
Week2: false
}, {
Name: 'the king 2 tiger',
Week1: false,
Week2: false
}]
}
},
Methods: {
GetCell (row, column, cell, event) {
Let the status=cell. Children [0]. Children [0]. The className. IndexOf (' is checked - ')==1;
Enclosing tableData. ForEach (item=& gt; {
If (item. Name==row. Name) {
Item. Week1=status;
. The console. The log (` ${item name} week ${column. Id. Slice (1) - 1} ${item. Week1? 'work' : 'don't go to work'} `)
}
})
}
},
})

CodePudding user response:

refer to 7th floor tron811325 response:

 & lt; body> 







 new Vue ({
El: '# app,
Data: the function () {
Return {
TableData: [{
Name: '1 king tiger,
Week1: false,
Week2: false
}, {
Name: 'the king 2 tiger',
Week1: false,
Week2: false
}]
}
},
Methods: {
GetCell (row, column, cell, event) {
Let the status=cell. Children [0]. Children [0]. The className. IndexOf (' is checked - ')==1;
Enclosing tableData. ForEach (item=& gt; {
If (item. Name==row. Name) {
Item. Week1=status;
. The console. The log (` ${item name} week ${column. Id. Slice (1) - 1} ${item. Week1? 'work' : 'don't go to work'} `)
}
})
}
},
})
no, not achieve them
  • Related