美文网首页
RN:Props

RN:Props

作者: 考槃在涧 | 来源:发表于2017-12-06 11:27 被阅读81次

React-Native:Props

props:属性,大多数的组件在创建时可以使用各种参数进行设置,就是属性props。比如<Image>组件的source来指定要显示的图片的地址,以及使用style控制尺寸等等。

let picUrl = {
    uir:'https://ss3.baidu.com/-fo3dSag_xI4khGko9WTAnF6hhy/image/h%3D300/sign=b4c574eab012c8fcabf3f0cdcc0292b4/8326cffc1e178a827f4f796aff03738da877e88d.jpg'
}
<Image source={picUrl} style={{width:190,height:110}}/>
  • 自定义的组件使用props。只需要在render函数中引用this.props,然后按照需要进行处理。
// 定义一个MyFirst组件
class MyFirst extends Component {
  render(){
    return (
      <Text>Hello {this.props.name}</Text>
    );
  }
}
// 定义一个NewCom组件 里面使用MyFirst组件并设置props
class NewCom extends Component {
  render(){
    return (
      <View>
        <MyFirst name = 'Zchen'/>
        <MyFirst name = 'Zjia'/>
      </View>
    );
  }
}
// 注册NewCom组件
AppRegistry.registerComponent("NewCom",()=>NewCom);

上面NewCom使用MyFirst组件时设置了name属性。

相关文章

  • RN:Props

    React-Native:Props props:属性,大多数的组件在创建时可以使用各种参数进行设置,就是属性pr...

  • React Native 之{...this.props}解惑

    一、 {...this.props}之惑 接触rn也有段时间了,有{...this.props}这么个东东老是出现...

  • 2018-06-11 RN组件的生命周期

    主题:组件的生命周期 RN组件的props和state 1.属性(props) 它是组件的不可变属性(组件自己不可...

  • RN之props属性

    大多数组件在创建时就可以使用各种参数来进行定制。用于定制的这些参数就称为props(属性)。以常见的基础组件Ima...

  • ReactNative学习之Props和State

    今天,我来说下RN里的Props和State属性,以及render()方法。 首先,我说下render()方法的作...

  • ReactNative Redux基本使用

    在RN里, 每个组件有两个属性, state 和 props, 他们都是对象, 里面可以包含多个属性 state ...

  • React Native 入门(五) - Props(属性)

    当前 RN 版本:0.49操作环境:Windows 10 Props(属性)是组件在被创建的时候就能够使用的各种参...

  • React Native 入门(六) - State(状态)

    当前 RN 版本:0.49操作环境:Windows 10 props 是在父组件中指定的,并且传递给当前组件之后,...

  • RN-Basic

    RN基础 Props(属性)/State(状态) 创建组件时 可以使用各种参数来进行定制, 用于定制的参数称为pr...

  • React-Native 学习RN和iOS交互

    一:iOS传递数据到RN1:iOS可以在初始化RCTRootView的时候传递props值; 2:可以通过appP...

网友评论

      本文标题:RN:Props

      本文链接:https://www.haomeiwen.com/subject/omekixtx.html