增加table单选的受控事件 #3
14
package-lock.json
generated
14
package-lock.json
generated
@ -8,7 +8,7 @@
|
|||||||
"name": "code-brick-wd",
|
"name": "code-brick-wd",
|
||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"code-brick-zj": "^0.0.1",
|
"code-brick-zj": "^0.0.4",
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
"element-ui": "^2.15.12",
|
"element-ui": "^2.15.12",
|
||||||
"vue": "^2.6.14",
|
"vue": "^2.6.14",
|
||||||
@ -4007,9 +4007,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"node_modules/code-brick-zj": {
|
"node_modules/code-brick-zj": {
|
||||||
"version": "0.0.1",
|
"version": "0.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/code-brick-zj/-/code-brick-zj-0.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/code-brick-zj/-/code-brick-zj-0.0.4.tgz",
|
||||||
"integrity": "sha512-XLvQEoiVWESDirkMKVKCIdH1jW3drkSS472uMWd1m6Ul5UVTUAiJvBQ15kEo+L7w8Zt7cC5ErF+laYHhNeoaIA=="
|
"integrity": "sha512-KSQ/drfIpoZKTrcARtuwG+6olde7fBYl+38Kialqa1NSoSDhPMqXTVw2N4KfA4MlucXQ/s3KZjfUsmKVZ70KkA=="
|
||||||
},
|
},
|
||||||
"node_modules/color-convert": {
|
"node_modules/color-convert": {
|
||||||
"version": "1.9.3",
|
"version": "1.9.3",
|
||||||
@ -14473,9 +14473,9 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
"code-brick-zj": {
|
"code-brick-zj": {
|
||||||
"version": "0.0.1",
|
"version": "0.0.4",
|
||||||
"resolved": "https://registry.npmjs.org/code-brick-zj/-/code-brick-zj-0.0.1.tgz",
|
"resolved": "https://registry.npmjs.org/code-brick-zj/-/code-brick-zj-0.0.4.tgz",
|
||||||
"integrity": "sha512-XLvQEoiVWESDirkMKVKCIdH1jW3drkSS472uMWd1m6Ul5UVTUAiJvBQ15kEo+L7w8Zt7cC5ErF+laYHhNeoaIA=="
|
"integrity": "sha512-KSQ/drfIpoZKTrcARtuwG+6olde7fBYl+38Kialqa1NSoSDhPMqXTVw2N4KfA4MlucXQ/s3KZjfUsmKVZ70KkA=="
|
||||||
},
|
},
|
||||||
"color-convert": {
|
"color-convert": {
|
||||||
"version": "1.9.3",
|
"version": "1.9.3",
|
||||||
|
@ -8,7 +8,7 @@
|
|||||||
"lint": "vue-cli-service lint"
|
"lint": "vue-cli-service lint"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"code-brick-zj": "^0.0.1",
|
"code-brick-zj": "^0.0.4",
|
||||||
"core-js": "^3.8.3",
|
"core-js": "^3.8.3",
|
||||||
"element-ui": "^2.15.12",
|
"element-ui": "^2.15.12",
|
||||||
"vue": "^2.6.14",
|
"vue": "^2.6.14",
|
||||||
|
@ -318,7 +318,11 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="demo-box">
|
<div class="demo-box">
|
||||||
<h3>单选</h3>
|
<h3>单选</h3>
|
||||||
|
<el-button size="small" @click="setCurrent(1)">选中第二行</el-button>
|
||||||
|
<el-button size="small" @click="setCurrent(-1)">取消选中</el-button>
|
||||||
<base-table
|
<base-table
|
||||||
|
ref="palletTable1"
|
||||||
|
id="palletTable"
|
||||||
:table-props="tableProps"
|
:table-props="tableProps"
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
:page="1"
|
:page="1"
|
||||||
@ -332,11 +336,16 @@
|
|||||||
Table
|
Table
|
||||||
组件提供了单选的支持,只需要配置<code>highlight-current-row</code>属性即可实现单选。
|
组件提供了单选的支持,只需要配置<code>highlight-current-row</code>属性即可实现单选。
|
||||||
之后由<code>current-change</code>事件来管理选中时触发的事件,它会传入<code>currentRow</code>,<code>oldCurrentRow</code>。
|
之后由<code>current-change</code>事件来管理选中时触发的事件,它会传入<code>currentRow</code>,<code>oldCurrentRow</code>。
|
||||||
|
使用按钮选中取消,必须要传id,id的值是唯一的,id的值需要和<code>setCurrent</code>中第一参数一样。
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<pre>
|
<pre>
|
||||||
|
<el-button size="small" @click="setCurrent(1)">选中第二行</el-button>
|
||||||
|
<el-button size="small" @click="setCurrent(-1)">取消选中</el-button>
|
||||||
<<span>template</span>>
|
<<span>template</span>>
|
||||||
<base-table
|
<base-table
|
||||||
|
ref="palletTable1"
|
||||||
|
id="palletTable"
|
||||||
:table-props="tableProps"
|
:table-props="tableProps"
|
||||||
:table-data="tableData"
|
:table-data="tableData"
|
||||||
:page="1"
|
:page="1"
|
||||||
@ -345,6 +354,10 @@
|
|||||||
@current-change="handleCurrentChange"
|
@current-change="handleCurrentChange"
|
||||||
/>
|
/>
|
||||||
<<span>/template</span>>
|
<<span>/template</span>>
|
||||||
|
methods:
|
||||||
|
setCurrent(index) {
|
||||||
|
this.$refs.palletTable1.setCurrent('palletTable', index)
|
||||||
|
}
|
||||||
</pre>
|
</pre>
|
||||||
</div>
|
</div>
|
||||||
</el-collapse-item>
|
</el-collapse-item>
|
||||||
@ -1168,8 +1181,8 @@ export default {
|
|||||||
}
|
}
|
||||||
return ''
|
return ''
|
||||||
},
|
},
|
||||||
setCurrent(row) {
|
setCurrent(index) {
|
||||||
this.$refs.singleTable.setCurrentRow(this.tableData[row])
|
this.$refs.palletTable1.setCurrent('palletTable', index)
|
||||||
},
|
},
|
||||||
handleCurrentChange(val) {
|
handleCurrentChange(val) {
|
||||||
console.log(val)
|
console.log(val)
|
||||||
|
Loading…
Reference in New Issue
Block a user