Upgrade to new form binder

This commit is contained in:
John Lyon-Smith
2018-05-15 13:09:13 -07:00
parent 8fcfa26063
commit aa2da7d55d
26 changed files with 307 additions and 194 deletions

View File

@@ -1,7 +1,7 @@
import React from 'react'
import PropTypes from 'prop-types'
import { View, Text, TouchableHighlight } from 'react-native'
import autobind from 'autobind-decorator'
import React from "react"
import PropTypes from "prop-types"
import { View, Text, TouchableHighlight } from "react-native"
import autobind from "autobind-decorator"
export class BoundButton extends React.Component {
static propTypes = {
@@ -9,7 +9,7 @@ export class BoundButton extends React.Component {
title: PropTypes.string,
binder: PropTypes.object.isRequired,
onPress: PropTypes.func,
width: PropTypes.oneOfType([ PropTypes.string, PropTypes.number ]),
width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
}
constructor(props) {
@@ -18,7 +18,7 @@ export class BoundButton extends React.Component {
const { name, binder } = this.props
binder.addListener(name, this.updateValue)
this.state = binder.getFieldState(name)
this.state = binder.getBindingState(name)
}
@autobind
@@ -34,7 +34,7 @@ export class BoundButton extends React.Component {
if (nextProps.binder !== this.props.binder) {
this.props.binder.removeListener(this.props.name, this.updateValue)
nextProps.binder.addListener(nextProps.name, this.updateValue)
this.setState(nextProps.binder.getFieldState(nextProps.name))
this.setState(nextProps.binder.getBindingState(nextProps.name))
}
}
@@ -48,17 +48,31 @@ export class BoundButton extends React.Component {
if (disabled) {
return (
<View style={{ flexDirection: 'column', justifyContent: 'center', paddingHorizontal: 10, height: 40, width , backgroundColor: '#E0E0E0' }}>
<Text style={{ alignSelf: 'center', color: '#AAAAAA' }}>{title}</Text>
<View
style={{
flexDirection: "column",
justifyContent: "center",
paddingHorizontal: 10,
height: 40,
width,
backgroundColor: "#E0E0E0",
}}>
<Text style={{ alignSelf: "center", color: "#AAAAAA" }}>{title}</Text>
</View>
)
} else {
return (
<TouchableHighlight
onPress={onPress}
style={{ justifyContent: 'center', paddingHorizontal: 10, height: 40, width, backgroundColor: '#3BB0FD' }}
underlayColor='#1A72AC'>
<Text style={{ alignSelf: 'center', color: 'black' }}>{title}</Text>
style={{
justifyContent: "center",
paddingHorizontal: 10,
height: 40,
width,
backgroundColor: "#3BB0FD",
}}
underlayColor="#1A72AC">
<Text style={{ alignSelf: "center", color: "black" }}>{title}</Text>
</TouchableHighlight>
)
}