[React Fundamentals] Owner Ownee Relationship
The owner-ownee relationship is used to designate a parent-child relationship with React components as it differs from the DOM relationship.
import React from 'react'; export default class App extends React.Component {
constructor(){
super(); //This is going to give us our context for this within our component
this.update = this.update.bind(this);
this.state = {
txt: 'State',
count: 1
}
}
update(e){
this.setState({
txt: e.target.value
})
}
render() {
return (
<div>
<Widget txt={this.state.txt} update={this.update}></Widget>
<Widget txt={this.state.txt} update={this.update}></Widget>
</div> )
}
} // "Widget" must be capitalized
const Widget = (props) => {
return (
<div>
<input type="text" onChange={props.update} />
<span>Hello {props.txt}</span>
</div>
)
}
[React Fundamentals] Owner Ownee Relationship的更多相关文章
- [React] React Fundamentals: Owner Ownee Relationship
The owner-ownee relationship is used to designate a parent-child relationship with React components ...
- [React] React Fundamentals: Accessing Child Properties
When you're building your React components, you'll probably want to access child properties of the m ...
- [React Fundamentals] Composable Components
To make more composable React components, you can define common APIs for similar component types. im ...
- [React Fundamentals] Component Lifecycle - Updating
The React component lifecycle will allow you to update your components at runtime. This lesson will ...
- [React Fundamentals] Component Lifecycle - Mounting Usage
The previous lesson introduced the React component lifecycle mounting and unmounting. In this lesson ...
- [React Fundamentals] Component Lifecycle - Mounting Basics
React components have a lifecycle, and you are able to access specific phases of that lifecycle. Thi ...
- [React Fundamentals] Using Refs to Access Components
When you are using React components you need to be able to access specific references to individual ...
- [React Fundamentals] Accessing Child Properties
When you're building your React components, you'll probably want to access child properties of the m ...
- [React Fundamentals] State Basics
State is used for properties on a component that will change, versus static properties that are pass ...
随机推荐
- Thread: BooleanRT : Realtime 3D boolean operations for (Runtime,Editor)
A Product by Mixed Dimensions What is BooleanRT? BooleanRT is a real-time 3D boolean operations exte ...
- BZOJ2055: 80人环游世界
题解: 总算A掉了,各种蛋疼... int main() { freopen("input.txt","r",stdin); freopen("out ...
- [swustoj 1095] 挖金子
挖金子(1095) 题目描述 你在一个N*M的区域中,一开始在(1,1)的位置,每个位置有可能有金子,也有可能不能到达,也有可能有传送门.你只能往右或者下走,不能走出这个区域.当你位于传送门时,传送门 ...
- spring+springMVC+JPA配置详解(使用缓存框架ehcache)
SpringMVC是越来越火,自己也弄一个Spring+SpringMVC+JPA的简单框架. 1.搭建环境. 1)下载Spring3.1.2的发布包:Hibernate4.1.7的发布包(没有使用h ...
- Java [leetcode 11] Container With Most Water
问题描述: Given n non-negative integers a1, a2, ..., an, where each represents a point at coordinate (i, ...
- 【转】自定义iOS7导航栏背景,标题和返回按钮文字颜色 -- 不错不错!!
原文网址:http://blog.csdn.net/mad1989/article/details/41516743 在iOS7下,默认导航栏背景,颜色是这样的,接下来我们就进行自定义,如果你仅仅是更 ...
- 静态Web开发 DOM
四章 Dom 1节dom中的顶级对象 dom(文档对象模型)js最终是要操作html页面,让html变成DHtml,而操作Html页面就要用到DOMDOM可以吧Html页面模拟成一个对象,如果js只是 ...
- Skyline学习教程
转自:http://yunjinzh.blog.sohu.com/165279318.html 当初开设这个blog的初衷就是将PPT与专业技术进行结合 将专业技术的介绍更加艺术化 但是之前一直都没有 ...
- Selenium2Library系列 keywords 之 _SelectElementKeywords 之 get_list_items(self, locator)
def get_list_items(self, locator): """Returns the values in the select list identifie ...
- HTTP DNS小结
https://www.dnspod.cn/httpdns/guide HttpDNS是使用HTTP协议向DNS服务器的80端口进行请求,代替传统的DNS协议向DNS服务器的53端口进行请求,绕开了运 ...