import CardTop from ../common/Cards.vue 

CardTop

 CardTop contenet 学校列表 back navageteNewadd btns 新增 /CardTop 

 template  div class card-top  div class tops v-if !Breadcrumb  span :class [Background ? content color : content ]  contenet /span  div class button v-if btns click back {{ btns }} /div  /div  div class tops1 v-if Breadcrumb  el-breadcrumb separator-class el-icon-arrow-right  div  el-breadcrumb-item :to { path: List[0].path } {{ List[0].name }} /el-breadcrumb-item  el-breadcrumb-item {{ List[1].name }} /el-breadcrumb-item  /div  div  div class button1 click back {{ btns }} /div  /div  /el-breadcrumb  /div  /div  /template  script export default { data() { return {} props: { // 设置是否是Breadcrumb Breadcrumb: { type: Boolean, default: false // 设置不是设置breadcrumb 的左边内容 contenet: String, // 设置按钮的内容 btns: { type: String, default:  // 设置breadcrumb list的数据 List: Array, // 设置是否有背景颜色 Background: { type: Boolean, default: false Height: { type: Number, default: 0 url: { type: String, default:  methods: { back() { this.$emit( back , this.btns, this.url) /script  style lang scss scope .card-top { box-sizing: border-box; width: 100%; height: 50px; margin-bottom: 20px; .tops { width: 100%; height: 50px; height: 100%; padding: 10px 20px; box-sizing: border-box; font-size: 16px; // font-weight: bold; color: #333333; border-bottom: 1px solid rgba(243, 243, 243, 1); // background: red; line-height: 32px; .button { width: 70px; height: 32px; background: rgba(32, 198, 200, 1); border-radius: 4px; float: right; text-align: center; line-height: 32px; font-size: 14px !important; color: white; cursor: pointer; .tops1 { width: 100%; height: 50px; padding: 10px 20px; box-sizing: border-box; line-height: 50px; .el-breadcrumb { width: 100%; line-height: 34px; margin: 0; font-size: 16px; justify-content: space-between; .el-button { cursor: pointer; :nth-of-type(2) { line-height: 34px; float: right; border-bottom: 1px solid rgba(243, 243, 243, 1); box-sizing: border-box; .content { font-size: 16px;// .el-button size mini type primary .button1 { width: 70px; height: 32px; background: rgba(32, 198, 200, 1); border-radius: 4px; float: right; text-align: center; font-size: 14px; color: white; line-height: 32px; cursor: pointer;.bc { width: 100%; height: 53px; background: #7ac9cb;.color { color: white; /style 

 data:{ testData:{ dataInfo:{ a: 我是a , b: 我是b  watch: { testDataNew: { handler: (val, olVal) { console.log( 我变化了 , val, olVal) deep: true computed: { testDataNew() { return JSON.parse(JSON.stringify(this.testData))

 如果页面初次加载时候需要select的框的值 那么一定要在mounted方法里执行 

https://www.jianshu.com/p/59dd28f0b9c9

 el-form-item  el-input placeholder 用户名 v-model form.username  i slot prefix class el-icon-thirdshouji /i  /el-input  /el-form-item 

:show-overflow-tooltip true  el-table-column prop school_name  :show-overflow-tooltip true  label 学校名称  align center  width 200  /el-table-column 

scrollbar-width: none;

::-webkit-scrollbar { display: none;

 el-table :data orderList  :row-class-name getRowClassName  default-expand-all :span-method arraySpanMethod  type expand  :header-cell-style getRowClass  style width: 100%  :span-method arraySpanMethod 

 arraySpanMethod({ row, column, rowIndex, columnIndex }) { console.log(rowIndex) if (rowIndex 0) { if (columnIndex 2) { return [1, 2] } else if (columnIndex 3) { return [0, 0] if (rowIndex 0) { if (columnIndex 5) { return [1, 2] } else if (columnIndex 6) { return [0, 0] if (rowIndex 0) { if (columnIndex 12) { return [1, 2] } else if (columnIndex 10) { return [0, 0]

 arr_arr[0] parseInt(res.data.data.province) arr_arr[1] parseInt(res.data.data.city) arr_arr[2] parseInt(res.data.data.district) this.$nextTick(() { this.addr_arr arr_arr // 等到dom加载完成后把数据赋值

 el-form-item label-width 100px label 所属地区  el-cascader filterable :options cityData v-model addr_arr /el-cascader  /el-form-item 

 // 在页面刷新时将store保存到sessionStorage里 window.addEventListener( beforeunload , () { sessionStorage.setItem( store , JSON.stringify(this.$store.state))