React-Native-UIAlert

Props属性说明

| name | type | Default | Extra | --------- |:-----: |:-----: | :----: | myData | Dictionary | {} | 控制显示内容 | id | String | nul | 按钮事件回调时区分那个按钮 | text | String | "" | 提示窗口的内容文案 | buttons | Array | [] | 两个维度的按钮多行多列:[[],[],[]],多行单列:[{},{},{}] | clickBtn | Function | null | 回调方法

使用说明

安装

npm install react-native-uialert --save

引入

import UIAlert from 'react-native-uialert'

Methods

• showV()//显示(默认是隐藏的)
• heiV()//隐藏

    //contentText 主体文案的style
	<UIAlert ref = "UIAlert" contentText = {{textAlign:'left'}} clickBtn = {( id, backData )=>{
        //id==myData.buttons.item中的，backData则是showV()传入的数据
    }}/>

    /****
   * 
   * buttons : [item，[item,item,item]]//内部可以是oject（）或者array（一行多个）
   * 
   * item : {
   *      title : 按钮文案
   *      titleColor : 文字颜色
   *      backgroundColor : 按钮背景色
   *      id : 区分回调
   * }
   * 
   * 
   */

//this.refs.UIAlert.showV( myData, backData )
if (this.refs.UIAlert) {
  this.refs.UIAlert.showV( {
      title: "title",//通知标题
      text: "text",//内容
      buttons: [{
          title: "b1",
          titleColor: WHITE_COLOR,
          backgroundColor: YELLOW_COLOR,
          id:1,
        },[{
          title: "b1",
          titleColor: WHITE_COLOR,
          backgroundColor: YELLOW_COLOR,
          id:1
        },{
          title: "b2",
          titleColor: WHITE_COLOR,
          backgroundColor: YELLOW_COLOR,
          id:2
      },{
          title: "b3",
          titleColor: WHITE_COLOR,
          backgroundColor: YELLOW_COLOR,
          id:2
      }]]
  } )
}

UIButton

属性说明

| Name | Type | Default | Extra | :----: | :----: | :----: | :----: | name | String | "" | 按钮的文字 | selected | Boolean | false | 选择中或非选中按钮状态 | tagId | id | null | 按钮的标识 | styles | Dictionary | {} | 按钮的样式 | onPress | Function | null | 按钮触发返回tagId

使用

    import { UIButton } from 'react-native-uialert'

       <View style={{ margin:5, height:35, }}>
            <UIButton
                name={ title }
                tagId = {id}
                onPress={(tagId)=>{
                    this.cancel(tagId);
                }}
                styles={{
                    backgroundColor:backgroundColor,
                    borderRadius:5,
                    fontSize:12,
                    titleColor:titleColor
                }}
            />
        </View>