vue2.0中子组件通过v-modal改变父组件中的值
父组件代码:
<template lang="pug">
div
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>
子组件代码:
<template lang="pug">
div this is child
</template>
<script>
export default{
created(){
this.$emit("input",[4,5,6])
}
}
</script>
效果如下:

vue2.0中子组件通过v-modal改变父组件中的值的更多相关文章
- vuejs2.0子组件改变父组件的数据
在vue2.0之后的版本中,不允许子组件直接改变父组件的数据,在1.0的版本中可以这样操作的,但是往往项目需求需要改变父组件的数据,2.0也是可一个,区别是,当我们把父元素的数据给子组件时,需要传一个 ...
- react当中子组件改变父组件的状态
子组件直接改变父组件传入的props值是不被允许的, 当需要在子组件当中改变父组件的某一个状态, 父组件传入一个改变状态的函数,然后在子组件当中调用函数即可
- React子组件怎么改变父组件的state
React子组件怎么改变父组件的state 1.父组件 class Father extends React.Component { construtor(props){ super(props); ...
- vue子组件使用自定义事件向父组件传递数据
使用v-on绑定自定义事件可以让子组件向父组件传递数据,用到了this.$emit(‘自定义的事件名称’,传递给父组件的数据) <!DOCTYPE html> <html lang= ...
- Vue的父子组件v-model双向绑定,父组件修改子组件中绑定的v-model属性
先来看下实现的效果,父组件中有个文本框,在点击下面按钮时弹出抽屉,抽屉里也有个文本框,文本框里的初始值要和父组件的文本框同步,并且修改抽屉里的文本框值时 父组件里的文本框值也要跟着改变 网上有大概三种 ...
- vue 子组件把数据传递给父组件
<div id="app"> <child v-on:drop='parent'></child> //这里v-on:drop="pa ...
- vue 专题 vue2.0各大前端移动端ui框架组件展示
Vue 专题 一个数据驱动的组件,为现代化的 Web 界面而生.具有可扩展的数据绑定机制,原生对象即模型,简洁明了的 API 组件化 UI 构建 多个轻量库搭配使用 请访问链接: https://ww ...
- vue2.0 自定义 饼状图 (Echarts)组件
1.自定义 图表 组件 Echarts.vue <!-- 自定义 echart 组件 --> <template> <div> <!-- echart表格 ...
- vue2.0 之 douban (二)创建自定义组件tabbar
1.大体布局 这个组件分为两部分:第一个是组件的外层容器,第二个是组件的子容器item,子组件里面又分为图片和文字组合.子组件有2个状态,一个默认灰色的状态,一个选中状态,我们来实现一下这个组件的布局 ...
随机推荐
- C++求两个数的最大值
//不使用if,:?等推断语句.求两个数字中最大的那个数字. #include<iostream> using namespace std; int main() { int a = -1 ...
- Android学习笔记(八)——显示运行进度对话框
显示运行进度对话框 我们经常有这种经历:运行某一应用程序时.须要等待一会,这时会显示一个进度(Please Wait)对话框,让用户知道操作正在进行. 我们继续在上一篇中的程序中加入代码~ 1.在上一 ...
- Python操作列表常用方法
Python操作列表的常用方法. 列表常用的方法操作列表以及小例子: 1. Append 在列表末尾添加元素,需在列表末尾添加元素,需要注意几个点: A. append中添加的参数是作为一个整体 &g ...
- Atitit.故障排除系列---NoClassDefFoundError NoClassDefFoundError
Atitit.故障排除系列---NoClassDefFoundError NoClassDefFoundError java.lang.ClassNotFoundException找不到类异常.当应 ...
- android.view.animation(1) - alpha、scale、translate、rotate、set的xml属性和用法(转)
一.ScaleAnimation ScaleAnimation(float fromX, float toX, float fromY, float toY, int pivotXType, floa ...
- 将多个文件夹内的txt合并
import os import re def text_create(name): """ 创建txt文件夹 """ desktop_pa ...
- weblogic线程阻塞性能调优(图解)转
声明:出现这个问题有程序方面.网络方面.weblogic设置方面等等原因,此文章主要讲述由于weblogic设置而导致的解决办法. 因为: 1.程序问题,需要项目自己去解决,weblogic在做优化处 ...
- oracle 命令 登录
1.打开终端,输入命令:sqlplus /nolog 2.连接数据库:conn user_name/passwd@db_name
- 一款纯html5实现的时钟
今天给大家分享一款非常漂亮的纯html5实现的时钟.整个界面都由html5绘制而成.一起看下效果图: 在线预览 源码下载 实现的代码. html代码: <div class="co ...
- sama5d3 环境检测 gpio--yx测试
说明: yx0--pioA0 yx1--pioA2 yx2--pioA4 yx3--pioA10 yx4--pioA14 yx5--pioA16 yx6--pioA12 yx7--pioA20 ...