Vue three rules:

  1. Components cannot modify properties outside prop

  2. The component fires events and passes parameters via $emit

  3. The component uses event to get event to get the parameters after the event gets emit

The Child component has the money property, which triggers update:money and passes money-100

<button @click=$emit('update:money',money-100)>
</button>
Copy the code

The parent component listens for the update: Money event and takes the money-100 parameter of $emit to Total

<Child :money="total" v-on:update:money="total=$event">
</Child>
Copy the code

With the.sync modifier, you can change to: Parent

<Child :money.sync="total"></Child>// sync does the above eventCopy the code