商品分类完成以后，西瓜口袋拼团系统开发找广州许生自然轮到了品牌功能了。先看看我们要实现的效果：接下来，我们从0开始，实现下从前端到后端的完整开发。7.1.设计前端页面为了方便看到效果，我们新建一个MyBrand.vue（注意先停掉服务器），从0开始搭建。内容初始化一下：<template><span>hello</span></template><script>exportdefault{name:"myBrand"}</script><!–scoped:当前样式只作用于当前组件的节点–><stylescoped></style>12345678910111213141516改变router新的index.js，将路由地址指向MyBrand.vue打开服务器，再次查看页面：干干净净了。只剩hello7.1.1.查询表格大家看到这个原型页面肯定能看出，其主体就是一个table。我们去Vuetify查看有关table的文档：仔细阅读，发现v-data-table中有以下核心属性：dark：是否使用黑暗色彩主题，默认是falseexpand：表格的行是否可以展开，默认是falseheaders：定义表头的数组，数组的每个元素就是一个表头信息对象，结构：{text:string,//表头的显示文本value:string,//表头对应的每行数据的keyalign:'left'|'center'|'right',//位置sortable:boolean,//是否可排序class:string[]|string,//样式width:string,//宽度}12345678items：表格的数据的数组，数组的每个元素是一行数据的对象，对象的key要与表头的value一致loading：是否显示加载数据的进度条，默认是falseno-data-text：当没有查询到数据时显示的提示信息，string类型，无默认值pagination.sync：包含分页和排序信息的对象，将其与vue实例中的属性关联，表格的分页或排序按钮被触发时，会自动将最新的分页和排序信息更新。