element-ui
vue-cli3集成element-ui:
1. vue create demo
2. vue add element
3. src\plugins\element.js 设置全局插件
4. views中页面按需引入
import {Row, Col, Dialog, Tabs, TabPane, Form, FormItem, Input,Message } from 'element-ui'
export default{
name: 'About',
components:{
[Row.name]:Row,
[Col.name]:Col,
[Dialog.name]:Dialog,
[Tabs.name]:Tabs,
[TabPane.name]:TabPane,
[Form.name]:Form,
[FormItem.name]:FormItem,
[Input.name]:Input,
[Message.name]:Message
}
常见问题
1、
EL-Table获得选中的行
<el-table ref="singleTable"/>
多选: this.$refs.multipleTable.store.states.selection
单选: this.$refs.summaryTable.store.states.currentRow
2、el-table 多选改单选
<el-table-column
label="操作"
width="55">
<template slot-scope="scope">
<el-checkbox v-model="scope.row.checked"></el-checkbox>
</template>
</el-table-column>
handleSelectionChange (row) {
this.tableData3.forEach(item => {
// 排他,每次选择时把其他选项都清除
if (item.id !== row.id) {
item.checked = false
}
})
console.log(row)
}
3、el-input type="textarea" 设置高度
:rows="5"
青春承载希望,奋斗成就未来