vue2.0子组件中怎么改变父组件中的值 ?


本文摘自PHP中文网,作者青灯夜游,侵删。

下面Vue.js教程栏目给大家介绍一下vue2.0中子组件通过v-modal改变父组件中值的方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

vue2.0中子组件通过v-modal改变父组件中的值

父组件代码:

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

<template lang="pug">

  p

    p this is father

    child(v-model="data")

</template>

<script>

  import child from "./childrenS.vue";

  export default{

    data(){

      return {

        data: [1, 2, 3]

      }

    },

    components: {

      child

    },

    watch: {

      data(n, o){

        console.log(n,o)

      }

    }

  }

</script>

  子组件代码:

1

2

3

4

5

6

7

8

9

10

<template lang="pug">

  p this is child

</template>

<script>

  export default{

      created(){

          this.$emit("input",[4,5,6])

      }

  }

</script>

  效果如下:

阅读剩余部分

相关阅读 >>

vue watch用法是什么

vue cli3引入bootstrap的方法介绍

vue中jquery怎么用

vue如何给组件加css样式

怎么运行vue.js

.vue文件可以写注释吗

vue怎么调用jquery包

vue和js区别是什么

vue和react有什么相似点

vue.js监听键盘事件

更多相关阅读请进入《vue》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...