今天將頁面中的下拉框由element-ui的el-select，改成了iview的Select，然後控制檯報錯， Invalid prop: type check failed for prop “value”. Expected String or number, got null. 意思是value應該是string或者number型別的，現在卻給了null，查看了iview中Select的API， 但是在select的option遍歷時，遍歷的陣列中有null

stateOptions: [
  {value: null, label: '全部'},
  {value: 0, label: '失敗'},
  {value: 1, label: '成功'},
  ],
 

後面我改回el-select就不報錯了，檢視Api，多了一個object，null在js被認為是object型別的，所以el-select可以。

下面想著更改el-select的樣式，它的高度預設是40px，iview的是32px，看著很不協調，在開發工具裡發現控制select高度的主要el-input__inner類 在style修改el-input__inner，不起作用，加上!important也一樣，查資料發現，elementUI的樣式是定義在全域性中，我們使用scoped時， 區域性樣式會被全域性樣式所覆蓋（vue預設全域性樣式覆蓋區域性樣式）

.el-input__inner{
	height:32px !important
}
 

解決方案有兩種，一種是去掉scoped標籤，為了避免影響其他的元件，可以給父元素加一個class或者id，在其裡面寫入樣式，

.selectPlat{ //父元素
	.el-input__inner { 
		 height:32px; 
	 } 
}

第二中是深度選擇器，當 style標籤有 scoped 屬性時，它的 CSS 只作用於當前元件中的元素。對於某些子元素，css樣式需要依賴父元素，比如width：100%，這時需要用到深度選擇器 >>> ，在sass或者less等前處理器下，用/deep/

.ivu-form-item{
  /deep/.el-input__inner{
    height: 32px;
  }
}