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个状态,一个默认灰色的状态,一个选中状态,我们来实现一下这个组件的布局 ...
随机推荐
- 总结js(Iframe、window.open、window.showModalDialog)父窗口与子窗口之间的操作
http://hi.baidu.com/yashua839/blog/item/131fdb2fe547ef221f3089af.html一.Iframe 篇 //&&&&am ...
- spring Log4j关于No appenders could be found for logger的警告
(spring环境下)配置Log4j时候,当启动WEB程序时,提示了如标题的警告,具体如下:log4j:WARN No appenders could be found for logger (org ...
- ubuntu 命令行下查看网页 w3m
w3m localhost/index.php
- Linux命令-帮助命令:help
which cd 查找cd命令的位置 which umask 查找umask命令的位置 Shell就是命令解释器,就是当你敲了一个命令,谁来把这个命令传递给内核,内核运行结束后返回一个结果,是谁把这个 ...
- OSI各层的功能和主要协议(转载)
OSI各层的功能和主要协议: 物理层 物理层规定了激活.维持.关闭通信端点之间的机械特性.电气特性.功能特性以及过程特性.该层为上层协议提供了一个传输数据的物理媒体. 在这一层,数据的单位称为比特(b ...
- centos gnome桌面放大
我不知道gnome 为什么要这么做.但是真的有效: gsettings set org.gnome.desktop.interface scaling-factor # 放大2倍
- laravel的cookie操作
前提你的整个http流程一定要走完,页就是必须走到view()或Response,你写到中间中断调试,cookie是设置不上去的......(坑~~) 读取: $value = Cookie::get ...
- JVM 参数详解
1.使用$JAVA_HOME/bin/java 可看到所有参数说明 用法: java [-options] class [args...] (执行类) 或 java [-options] -jar ...
- Atitit.注解and属性解析(2)---------语法分析 生成AST attilax总结 java .net
Atitit.注解and属性解析(2)---------语法分析 生成AST attilax总结 java .net 1. 应用场景:::因为要使用ui化的注解 1 2. 使用解释器方式来实现生成 ...
- Android Camera API/Camera2 API 相机预览及滤镜、贴纸等处理
Android Lollipop 添加了Camera2 API,并将原来的Camera API标记为废弃了.相对原来的Camera API来说.Camera2是又一次定义的相机 API,也重构了相机 ...