如何建立一个带论坛的网站,怎样提升企业网站的访问,vps远程桌面服务器,网站做推广需要到工信部备案吗将表格二次封装#xff0c;方便以后开发中的复用。每次只需调用表格组件后#xff0c;在父组件中往子组件标签上写入dataSource#xff08;表格数据#xff09;和columns#xff08;表格列标题#xff09;即可。 此案例中最后一列是删除按钮#xff0c;动态生成#xf…将表格二次封装方便以后开发中的复用。每次只需调用表格组件后在父组件中往子组件标签上写入dataSource表格数据和columns表格列标题即可。 此案例中最后一列是删除按钮动态生成在父组件中定义columns时用 slots: { customRender: operation } 来动态渲染。 在子组件的template标签中通过slot插槽来传值每一行的值在父组件中通过v-slotslotProps接收子组件传过来的值。 示例代码如下 子组件MngTable.vue templatea-table :dataSourcedataSource :columnscolumnstemplate #operation{ record }slot :recordrecord/slot/template/a-table /templatescript langts import { defineComponent } from vue;export default defineComponent({name: MngTable,props: {dataSource: [],columns: [],},components: {},setup() {return {};}, }); /scriptstyle langscss scoped/style 父组件Parent.vue templatediv classsection pitch_default p_defaultMngTable :dataSourcedataSource :columnscolumnstemplate v-slotslotPropsa-button typeprimary删除/a-button/template/MngTable/div /templatescript langts import { defineComponent } from vue; import { ManageTable } from /components;export default defineComponent({name: Parent,components: {ManageTable,},setup() {const pagination {total: 200,current: 1,pageSize: 10,};const columns [{title: name,dataIndex: name,key: name,},{title: age,dataIndex: age,key: age,},{title: operation,key: operation,slots: { customRender: operation },},];const dataSource [{name: 胡彦斌,age: 32,},{name: 胡彦祖,age: 42,},],return {dataSource, columns,pagination,};}, }); /scriptstyle langscss scoped/style