vue------分类下拉列表获取链接内容-------链接的文章在数据库中不存在id
实现功能:在数据库中没有定义分类的字段,实现点击分类获取链接功能
数据表
后端
定义获取文章的方法
vue
通过分类获取对应内容,由于分类的字段在数据库中不存在这边定义为artid
<el-form-item label="分类"> <el-select v-model="query.artid" placeholder="请选择" @change="selSel()" clearable filterable > <el-option v-for="item in artList" :key="item.id" :label="item.title" :value="item.id" ></el-option> </el-select> </el-form-item>
在对话框中分类的调用,使用chage调用来选择文章加载链接的方法(artSelect)
<el-form-item prop="artid" label="文章关联"> <el-select placeholder="请选择关联文章" v-model="form.artid" style="width:100%;" clearable filterable @change="artSelect" > <el-option v-for="item in artList" :key="item.id" :label="item.title" :value="item.id"></el-option> </el-select> </el-form-item>
在data中定义文章在载的列表artList
定义方法获取文章内容
在created中将获得文章内容的方法加进去getArtList
在最后加入点击文章获取链接的方法,将方法放到对话框中,最后统一的将结果传入给备注和链接
//文章选择结果 artSelect(e) { var _this = this; var artid = e; var artList = this.artList; var thisItem = null; for (var i = 0; i < artList.length; i++) { var item = artList[i]; if (item.id == artid) { thisItem = item; break; } } this.form.linkUrl = "/pages/art/helpdetail/helpdetail?id=" + artid; this.form.summary = item.title; } }