The vue2.0 parent component transmits data to the child component.

The vue2.0 parent component transmits data to the child component.

Reference Sub-component A. vue in the parent component App. vue and pass the name value to component.

1. Installation

Create a folder on the desktop

$ Cd to the file $ npm install-g vue-cli $ vue init webpack. $ npm install $ npm run dev

Vue init webpack. Subsequent options

2. Delete

1. delete some content in the App as follows:

2. Delete HelloWorld. vue from the components File

3. Modify

Modify App. vue

As follows:

<Template> <div id = "app"> // message is defined in the props of the Child component <A v-bind: message = "name"/> </div> </template> <script> import A from '. /components/A' export default {name: 'app', components: {A}, data () {return {name: "I am Data" }}</script>

4. Create

Create A. vue in components and write the following content:

<Template> <div >{{ message }}</div> </template> <script> export default {props: ['message'] // receives data transmitted from the message.} </script>

5. Final

Enter

$ npm run dev

Summary

The above is a small series of methods for passing data from the vue2.0 parent component to the child component. I hope it will be helpful to you. If you have any questions, please leave a message for me, the editor will reply to you in a timely manner. Thank you very much for your support for the help House website!