react typescript 子组件给父组件传值
//父组件
import * as React from 'react'
import { Input } from 'antd'
const Search = Input.Search
import "./index.less"
import Child from "./compon/list"
export default class ProjectList extends React.Component<IProps>{
constructor(props: IProps) {
super(props) }
handle = (val) => { //val就是子组件传的值1
console.log(val)
// this.setState({
// mess:val
// })
}render(){
return (
<div>
<Child GETState= {this.handle.bind(this)} /> // 这种tslint git提交报bind错误
<Child GETState= {(val)=>this.handle(val)} />
</div>
)
} }
//子组件
import * as React from 'react'
import { Row, Col } from 'antd';
import "./list.less" interface IProps {
msg?: any
MakeMoney?:any
GETState?: any //主要这段代码
}
interface IState {
lg?: any }
export default class List extends React.Component<IProps, IState> {
constructor(props: IProps) {
super(props) }
state = {
lg: 6,
a:68
}
toggle = () => {
console.log('f')
this.setState({
lg: 12
})
} render(){
console.log(this.props.msg)
const { lg } = this.state;
return (
<div>
<button onClick={() => this.props.GETState(this.state.a)}>子组件</button>
)
}
react typescript 子组件给父组件传值的更多相关文章
- 九、React中的组件、父子组件、React props父组件给子组件传值、子组件给父组件传值、父组件中通过refs获取子组件属性和方法
一.概述 React中的组件: 解决html 标签构建应用的不足. 使用组件的好处:把公共的功能单独抽离成一个文件作为一个组件,哪里里使用哪里引入. [父子组件]:组件的相互调用中,我们把调用者称为父 ...
- react子组件向父组件传值
子组件向父组件传值,注意父组件传递函数的时候必须绑定this到当前父组件(handleEmail={this.handleEmail.bind(this)}),不然会报错 /***实现在输入框输入邮箱 ...
- React篇-子组件调用父组件方法,并传值
react 中子组件调用父组件的方法,通过props: 父组件: isNote(data){} <div className="tabC01"> <FTab ta ...
- react typescript 子组件调用父组件
//父组件 import * as React from 'react'import { Input } from 'antd'const Search = Input.Searchimport &q ...
- vue2.0 子组件和父组件之间的传值(转载)
Vue是一个轻量级的渐进式框架,对于它的一些特性和优点在此就不做赘述,本篇文章主要来探讨一下Vue子父组件通信的问题 首先我们先搭好开发环境,我们首先得装好git和npm这两个工具(如果有不清楚的同学 ...
- Vue 组件&组件之间的通信 之 子组件向父组件传值
子组件向父组件传值:子组件通过$.emit()方法以事件形式向父组件发送消息传值: 使用步骤: 定义组件:现有自定义组件com-a.com-b,com-a是com-b的父组件: 准备获取数据:父组件c ...
- React子组件和父组件通信
React子组件和父组件通信包括以下几个方面: 子组件获取父组件属性:props或者state 子组件调用父组件的方法 父组件获取子组件的属性:props或者state 父组件调用子组件的方法 我们从 ...
- vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值。
vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值. vue 父组件与子组件相互通信 一.父组件给子组件传值 props 实现父组件向子组件传值. 1父组件里: ...
- 【转】Vue组件一-父组件传值给子组件
Vue组件一-父组件传值给子组件 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消息 ...
- Vue2.0 子组件和父组件之间的传值
Vue是一个轻量级的渐进式框架,对于它的一些特性和优点在此就不做赘述,本篇文章主要来探讨一下Vue子父组件通信的问题 首先我们先搭好开发环境,我们首先得装好git和npm这两个工具(如果有不清楚的同学 ...
随机推荐
- Wireshark 抓包遇到 you don’t have permission to capture on that device mac 错误的解决方案
Wireshark 抓包遇到 you don’t have permission to capture on that device mac 错误的解决方案 上次有篇博客讲了如何利用wireshark ...
- SyntaxError:identifier starts immediately after numeric literal
1.错误描写叙述 2.错误原因 因为在改动方法传參的过程,须要传个id,可是这个id是字符串类型,传入的是数值型 3.解决的方法 在传參时,须要加入"",变成字符串类型 User. ...
- JMeter—丰富报表功能PerfMon插件
可能有童鞋不知道PerfMon插件是干啥的.这里简要说一下: 在做负载測试时,我们要时刻关注server的CPU.MEM--的使用情况,可是JMeter本身对这些信息是不做收集的,这个时候PerfMo ...
- 【剑指offer】斐波那契序列与跳台阶
转载请注明出处:http://blog.csdn.net/ns_code/article/details/25337983 剑指offer上的第9题,简单题,在九度OJ上測试通过. 主要注意下面几点: ...
- JavaScript Patterns 2.1 Writing Maintainable Code
Revisiting the code after some time has passed requires: • Time to relearn and understand the proble ...
- C#使用Quartz.NET详解
Quartz.NET是一个开源的作业调度框架,是OpenSymphony 的 Quartz API的.NET移植,它用C#写成,可用于winform和asp.net应用中.它提供了巨大的灵活性而不牺牲 ...
- Luogu1275魔板
https://zybuluo.com/ysner/note/1136271 题面 有这样一种魔板:它是一个长方形的面板,被划分成\(n\)行\(m\)列的\(n*m\)个方格.每个方格内有一个小灯泡 ...
- JSP-Runoob:JSP 表单处理
ylbtech-JSP-Runoob:JSP 表单处理 1.返回顶部 1. JSP 表单处理 我们在浏览网页的时候,经常需要向服务器提交信息,并让后台程序处理.浏览器中使用 GET 和 POST 方法 ...
- openStack Packages yum upgrade
依赖关系解决 ============================================================================================= ...
- Another lottery
http://acm.hdu.edu.cn/showproblem.php?pid=2985 题意:有n个人每个人可以买m轮彩票,每轮可以买尽可能多的彩票.如果该彩票在i轮被抽到,则该人可以获得2^i ...