Parent and child components pass values?

parent father.vue:
< template > 

<div>
    <A></A>
    <B></B>
</div>

< / template >
where component An is the table component, and the data in the table is passed in by the father component.
B is a component that adds Form form data. If you want to add data to the table of component A through component B, how do you write vue code?

Vue.js
Aug.17,2021 
<template>
  <div>
    <A :table-data="tableData"></A>
    <B @on-add="onAddTableData"></B>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        tableData: [],
      };
    },
    methods: {
      onAddTableData(data) {
        this.tableData.push(data);
      },
    },
  };
</script>

is something like this: component B adds the form and notifies the parent component to add data through $emit ('on-add', newData) , and component A updates

accordingly.

to achieve bidirectional data binding between parent and child components, you can use sync

Previous: Put the api data in vuex and refresh the page normally, then retrieve the interface data and store it in vuex, but it becomes empty?

Next: How to use Webpack so that css can only be used by a single component

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu