child.vue 596 B

12345678910111213141516171819202122232425262728
  1. <template>
  2. <div>
  3. <button @click="$emit('countChange', counte++)">emit value</button>
  4. <div>from parent: {{passToChild}} </div>
  5. <div>from parent to computed: {{computedFromProps}} </div>
  6. <div>from parent to data: {{dataFromProps}} </div>
  7. </div>
  8. </template>
  9. <script>
  10. export default {
  11. name: "Child",
  12. props: {
  13. passToChild: String
  14. },
  15. data() {
  16. return {
  17. counte: 0,
  18. dataFromProps: "data: " + this.passToChild // non reactive
  19. };
  20. },
  21. computed: {
  22. computedFromProps: function() {
  23. return "computed: " + this.passToChild;
  24. }
  25. }
  26. };
  27. </script>