<el-dialog
title="添加分类"
:visible.sync="addCateDialogVisible"
width="50%"
>
<!-- 添加分类表单 -->
<el-form
:model="addCateForm"
:rules="addCateFormRules"
ref="addCateFormRef"
label-width="100px"
>
<el-form-item label="分类名称:" prop="cat_name">
<el-input v-model="addCateForm.cat_name"></el-input>
</el-form-item>
<el-form-item label="父级分类:"> </el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="addCateDialogVisible = false">取 消</el-button>
<el-button type="primary" @click="addCateDialogVisible = false"
>确 定</el-button
>
</span>
</el-dialog>
export default {
data() {
return {
querInfo: {
type: 3,
pagenum: 1,
pagesize: 5,
},
// 商品分类数据列表为空
cateList: [],
total: 0,
columns: [
{
label: '分类名称 ',
prop: 'cat_name',
},
{
label: '是否有效',
// 表示,当前列为模板列
type: 'template',
template: 'isok',
},
{
label: '排序',
// 表示,当前列为模板列
type: 'template',
template: 'order',
},
{
label: '操作',
// 表示,当前列为模板列
type: 'template',
template: 'opt',
},
],
// 控制添加对话框的显示隐藏
addCateDialogVisible: false,
addCateForm: {
// 将要添加的分类名称
cat_name: '',
// 父级分类的id
cat_pid: 0,
// 分类的等级默认为一级分类
cat_level: 0,
},
// 父级分类的列表
parentCateList: [],
// 校验规则
addCateFormRules: {
cat_name: [
{ required: true, message: '请输入分类名称', trigger: 'blur' },
],
},
}
},
created() {
this.getcateList()
},
methods: {
// 获取商品分类数据
async getcateList() {
const { data: res } = await this.$http.get('categories', {
params: this.querInfo,
})
if (res.meta.status !== 200) {
return this.$message.error('获取商品分类失败')
}
console.log(res.data)
this.cateList = res.data.result
this.total = res.data.total
},
// 监听pagesize改变
handleSizeChange(newSize) {
this.querInfo.pagesize = newSize
this.getcateList()
},
// 监听pagenum改变
handleCurrentChange(newPage) {
this.querInfo.pagenum = newPage
this.getcateList()
},
// 点击按钮,展示添加分类的对话框
shoeAddCateDialog() {
// 获取父级分类的数据列表
this.getParentCateList()
// 然后再展示对话框
this.addCateDialogVisible = true
},
// 获取父级分类的数据列表
async getParentCateList() {
const { data: res } = await this.$http.get('categories', {
params: { type: 2 },
})
if (res.meta.status !== 200) {
return this.$message.error('获取父级分类失败!')
}
this.parentCateList = res.data
// console.log(res.data)
},
},
}
vue获取完数据赋完值之后,显示在页面上,不显示, 那个父级分类那个标签里
- 写回答
- 好问题 0 提建议
- 追加酬金
- 关注问题
- 邀请回答
-
5条回答 默认 最新
- leewen5 2021-04-28 16:08关注
<el-form-item label="父级分类:"> </el-form-item> 这里面没使用prop绑定字段呢
解决 1无用
悬赏问题
- ¥15 java代码写在记事本上后在cmd上运行时无报错但又没生成文件
- ¥15 关于#python#的问题:在跑ldsc数据整理的时候一直抱这种错误,要么--out识别不了参数,要么--merge-alleles识别不了参数(操作系统-linux)
- ¥15 PPOCRLabel
- ¥15 混合键合键合机对准标识
- ¥100 现在不懂的是如何将当前的相机中的照片,作为纹理贴图,映射到扫描出的模型上
- ¥15 魔霸ROG7 pro,win11.息屏后会显示黑屏,如图,如何解决?(关键词-重新启动)
- ¥15 有没有人知道这是哪里出了问题啊?要怎么改呀?
- ¥200 C++表格文件处理-悬赏
- ¥15 Windows Server2016本地登录失败
- ¥15 复合卡卡号轨道写入芯片卡