Vue和semantic ui之选择列表(select)控件赋值问题(二)

接着上篇《Vue和semantic ui之选择列表(select)控件赋值问题(一)》,废话不多说,前因后果可以看《Vue和semantic ui之选择列表(select)控件赋值问题(一)》(请移步https://www.jianshu.com/p/b86737957815)。

原来解决办法:修改后html代码

<select class="ui search dropdown"  v-model="user_group_select">
    <option v-for="user_group in user_group_list" v-if="single_user.user_group_id==user_group.user_group_id" :value="user_group.user_group_id" v-text="user_group.user_group_name" selected></option>
    <option v-for="user_group in user_group_list" v-if="single_user.user_group_id!=user_group.user_group_id" :value="user_group.user_group_id" v-text="user_group.user_group_name"></option>
</select>

这次解决办法:修改后html代码和js代码

html:这个代码看上去比上面正常多了,上面的代码实在是我的骚操作
<select class="ui search dropdown"  v-model="user_group_select">
    <option v-for="user_group in user_group_list" :value="user_group.user_group_id" v-text="user_group.user_group_name"></option>
</select>

js:可以在改变user_group_select值的地方写上下面的代码,就可以改变选择列表(select)的显示了。
    set value和set text同时使用,不然可能会显示不出来。
$('.ui.search.dropdown').dropdown('set value', user_group_select)
$('.ui.search.dropdown').dropdown('set text', user_group_name)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 前端开发面试题 <a name='preface'>前言</a> 只看问题点这里 看全部问题和答案点这里 本文由我...
    自you是敏感词阅读 809评论 0 3
  • 前端开发面试题 面试题目: 根据你的等级和职位的变化,入门级到专家级,广度和深度都会有所增加。 题目类型: 理论知...
    怡宝丶阅读 2,622评论 0 7
  • 新鲜的Semantic-UI 优秀的前端界面框架,语义化的标签更容易理解与记忆,不过相比于bootstap,组件还...
    风穆雷阅读 11,857评论 0 3
  • 前端经典面试题: 1、(前端面试题)https://zhuanlan.zhihu.com/p/84212558?f...
    who_are_you_阅读 392评论 0 2
  • vue 学习 CDN 一. Vue 实例 1.1 创建一个 Vue 实例 每一个Vue应用都是通过Vue函数创建一...
    坚持日更的路上阅读 269评论 0 0