npmchenwei111/app/views/borrowdetail/CompanyDetailQuestionListView.js

test1111

/**
 * Created by chenwei on 2017/7/17.
 */

import React, { Component } from 'react'
import { StyleSheet, Text, View } from 'react-native'
import Utils from '../../utils/Utils'
import { px, sp } from '../../utils/Px2dp'
import R from '../../assets/R'
import Device from '../../utils/Device'

const PropTypes = require('prop-types');

class CompanyDetailQuestionListView extends Component {

  //设置必须属性的检测
  static propTypes = {
    // nav: PropTypes.object.isRequired,
  }

  constructor (props) {
    super(props)
    this._initData()
  }

  //初始化state
  _initData () {
    this.data = {
      questions: [],
      ...this.props.data
    }
  }

  //@Override 重写方法
  componentWillReceiveProps (nextProps) {
    this.data = {...this.data, ...nextProps.data}
  }

  render () {
    return (
      <View style={styles.container}>
        {
          this._renderQuestion(this.data.questions)
        }
      </View>
    )
  }

  /**
   * 渲染常见问题
   * @param questions
   * @private
   */
  _renderQuestion (array) {
    console.log(array, 'question')
    let arr = []
    if (Utils.isEmpty(array)) return arr

    for (let ques of array) {
      arr.push(<View
        key={arr.length}
        style={{
          flexDirection: 'column', marginLeft: px(16), marginRight: px(16),
          marginTop: px(12), marginBottom: px(12)
        }}>

        <View style={{flexDirection: 'row'}}>

          <View style={{
            backgroundColor: R.color.blue, height: px(7), width: px(7), marginTop: px(7),
            borderRadius: px(3.5)
          }}/>

          <Text style={{marginLeft: px(10), fontSize: sp(15), color: R.color.font_black}}>
            {ques.question}
          </Text>
        </View>

        <Text style={{
          fontSize: sp(14), color: R.color.font_gray,
          marginLeft: px(2),
          marginTop: px(8),
          lineHeight: px(25),
        }}>
          {ques.answer}
        </Text>
      </View>)

      if (arr.length < array.length * 2 - 1) {
        arr.push(<View
          key={arr.length}
          style={{
            backgroundColor: R.color.gray_line,
            marginLeft: px(16),
            height: px(0.5)
          }}/>)
      }
    }

    return arr
  }

}

const styles = StyleSheet.create({
  container: {
    flexDirection: 'column',
    width: Device.width
  }
})

export default CompanyDetailQuestionListView