React-Native 属性设置props
来源:互联网 发布:阿里云服务器新手 编辑:程序博客网 时间:2024/05/21 13:40
组件的静态数据由props控制,大多数组件在创建时就可以使用各种参数来进行定制。用于定制的这些参数就称为props(属性)。
//Image中的source和style就是其属性(props)class Bananas extends Component { render() { let pic = { uri: 'https://upload.wikimedia.org/wikipedia/commons/d/de/Bananavarieties.jpg' }; return ( <Image source={pic} style={{width: 193, height: 110}} /> ); }}
自定义的组件也可以使用props。通过在不同的场景使用不同的属性定制,可以尽量提高自定义组件的复用范畴。只需在render函数中引用this.props,然后按需处理即可。下面是一个例子:
//这个例子中的this.props.name就是用的在LotsOfGreetings中初始化的时候给定的name里面的值import React, { Component } from 'react';import { AppRegistry, Text, View } from 'react-native';class Greeting extends Component { render() { return ( <Text>Hello {this.props.name}!</Text> ); }}class LotsOfGreetings extends Component { render() { return ( <View style={{alignItems: 'center'}}> <Greeting name='Rexxar' /> <Greeting name='Jaina' /> <Greeting name='Valeera' /> </View> ); }}AppRegistry.registerComponent('LotsOfGreetings', () => LotsOfGreetings);
如果是涉及到动态变化就需要使用到state属性了。
阅读全文
0 0
- React-Native 属性设置props
- React Native之Props属性
- React Native的this.props获取属性
- React Native 之 Props
- 混合开发的大趋势之一React Native Props (属性)
- React Native组件的生命周期及属性props
- React 之props属性
- React Native开发】React Native 基础之Props(属性)与State(状态)使用讲解
- react native -- this.props.children
- React Native State和Props
- [React-Native]Props和State
- React native学习第一章:Props
- react demo6 (设置组件自身属性this.props)
- react demo7 (设置组件自身属性...this.props)
- react demo8 (设置组件自身属性this.props.children)
- React 认知 四 Props 属性
- React Native从零开始(三)Props(属性)和State(状态)
- React Native 组件的默认属性Props的两种写法
- 从0到1了解JVM基本原理(一):Java内存区域
- mybatis xml映射总结
- Spring-Redis基于Redis的MS消息服务
- C#类和对象(二)——类
- java基础---Java中的构造方法总结
- React-Native 属性设置props
- 【第五届蓝桥杯】大衍数列
- 通过Spring Data Neo4J操作您的图形数据库
- c++基础
- 因为eclipse版本导致的几个小问题
- Spring配置文件详解
- 优化limit分页(延迟关联)
- artDialog对话框
- eval解析JSON中的注意点