最近在使用antd vue開發一個前端的項目，遇見了不少的坑，記錄一下問題的解決
- 使用router-link跳轉頁面時的傳值 1 <router-link :to="{name: 'editBands', params: { record }}">編輯</router-link> ,name 是你在路由文件中，給頁面定義的名字，然后把要傳的值賦給 params，
- 在頁面跳轉之后需要取到值，這里可以在鈎子函數中獲取，created, mounted ,(還有一些鈎子函數可以參考生命周期)，在鈎子函數中賦值給 data ，要使用 1 this.$data ,切記不要用this.data，取值用 1 this.$route.params , 切記是 $route, 不是 $router
- 再是一個 select 初始值的坑，可以寫成這樣
1 <a-select v-decorator="['nationality',validateRules.nationality]"> 2 <a-select-option value="1">中國</a-select-option> 3 <a-select-option value="2">歐美</a-select-option> 4 <a-select-option value="3">日本</a-select-option> 5 <a-select-option value="4">韓國</a-select-option> 6 </a-select> -
1 <script> 2 import { axios } from '@/utils/request' 3 export default { 4 name: 'addBands', 5 data () { 6 return { 7 imgUrl: '', 8 form: this.$form.createForm(this), 9 headers: { 10 authorization: 'authorization-text' 11 }, 12 validateRules: { 13 name: { 14 initialValue: '', 15 rules: [{ required: true, message: '品牌不能為空！' }] 16 }, 17 nationality: { 18 initialValue: '', 19 rules: [{ required: true, message: '選項不能為空！' }] 20 }, 21 introduce: { 22 initialValue: '', 23 rules: [{ required: true, message: '內容不能為空！' }] 24 }, 25 engName: { 26 initialValue: '', 27 rules: [{ required: true, message: '內容不能為空！' }] 28 } 29 } 30 } 31 } 32 } 33 </script>貼出來的不是整段代碼，只是在模版中，和js塊中的定義， validateRules 是定義的表單中字段的驗證規則和初始值。初始值用 initvalValue 定義，驗證規則用 rules定義。
- 還遇到了一個坑，多數情況下，我們對select 中的 option 選項的值 value 的定義，都是數字形式的，但是！！，在給select 設置初始值的時候，要對數字形式的值進行toString()，操作，否則select 的默認值，會莫名的顯示成數字，而不是option選項中的文字。