Element框架中的Switch按鈕在table表單無法使用問題


一、 今天在學習Element框架的時候遇到一個小坑,就是把Switch開關放到table標簽里面,就無法使用了,經過漫長時間的查找發現這么寫可以解決,

<el-table-column fixed="right" label="狀態" width="150" height="50px">
      <template slot-scope='scope'>
       <el-switch
        style="display: block"
        v-model="value2"
        active-color="#13ce66"
        inactive-color="#ff4949"
        active-text="啟用"
        inactive-text="禁用"
      >
      </el-switch>
       </template>
      </el-table-column>

但是這么寫了以后他又出問題了,就是
image

大致意思就是:scope定義了沒有被使用,對於一個前端小白來說,這個玩意怎么會報錯呢,於是又開始一番搜索百度,終於功夫不負有心人讓我找到了,問我發現這個slot-scope屬性里面定義了值后還得在v-model里使用v-model="scope.row.自己定義的值",否則就會報錯

 <template slot-scope='scope'>
       <el-switch
        style="display: block"
        v-model="scope.row.value2"
        active-color="#13ce66"
        inactive-color="#ff4949"
        active-text="啟用"
        inactive-text="禁用"
      >
      </el-switch>
       </template>

加上以后,你就會發現小開關終於能用了,不容易啊,完結撒花✿✿ヽ(°▽°)ノ✿✿✿ヽ(°▽°)ノ✿


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM