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如何动态增加css

vue+axios+php如何实现上传文件功能?

vue路由跳转的三种方式是什么

vue-router是什么

vue的优点是什么

vue.js怎么进行页面跳转?

vue中mounted和created的区别(图文详解)

vue中mint ui是什么?

vue中让子组件修改父组件数据的方法

javascript之ssm+vue前后端分离框架整合实现

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




打赏

取消

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

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

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

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

评论

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