I wanted to encapsulate a table component with search function myself, so I created a subcomponent tableWithSearch
< template >
{{tableData}} <!-- a.--> <div> <table :column="tableColumn" :data="tableDataAfterSearch"></table> <div> </template> <script> export defualt{ props:{ tableColumn:{ required:true }, tableData:{ required:true } }, methods:{ initData(){ //tableDatatableDataAfterSearch console.log(this.tableData) //b.shu"chu } } } </script>< / template >
in the parent component, axios is used to obtain data from the background during mounted, and then this.$ref.searchTable is used to call the init method of the child component. As a result, the output from an is the normal background value and the output at b is empty. Add a button to the parent component, and when the button triggers the function of fetching the number, the ab will have normal numbers in both places.
what is this all about?