小编Xav*_* A.的帖子

在React Native上使用flexBox的2列布局

我正在尝试从项目列表中在React Native中进行两列布局.如果我定义项目的宽度似乎只能工作,我想只定义父宽度的百分比(0.5将产生2列布局,但0.25将产生4列1).可以这样做吗?

export default class App extends Component {
  render() {
    return (
      <View style={[styles.container, {width:width}]}>
        <View style={styles.item}><Text>{'item1'}</Text></View>
        <View style={styles.item}><Text>{'item2'}</Text></View>
        <View style={styles.item}><Text>{'item3'}</Text></View>
        <View style={styles.item}><Text>{'item4'}</Text></View>
        <View style={styles.item}><Text>{'item4'}</Text></View>
        <View style={styles.item}><Text>{'item5'}</Text></View>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    flexDirection: 'row',
    flexWrap: 'wrap',
  },
  item :{
    flex: 0.5, //why this doesnt work???
    // width: 150, //using fixed item width instead of flex: 0.5 works
    height: 100,
    padding: 10,
    backgroundColor: 'red',
    // flexGrow: 1,
    // flexShrink: 0,
  }
});
Run Code Online (Sandbox Code Playgroud)

你可以在这里玩它: …

flexbox react-native

10
推荐指数
2
解决办法
1万
查看次数

Realm.open 与新领域

在 React Native 应用程序的上下文中,仅在本地使用 Realm(因此目前没有领域对象服务器)。使用何时打开一个领域Realm.open({schema: [Car, Person]})和创建一个新的领域实例之间有什么区别 new Realm({schema: [Car, Person]});

看起来Realm.open只是一个确保同步完成的回调,所以只需要同步领域?

到目前为止,这是我发现的:

Realm.open:

根据文档参考的 Realm.open意思是“使用承诺异步打开一个领域。如果领域被同步,它将在可用之前完全同步。” 这是js文档中显示的方式

新领域:

根据文档参考中的构造函数,new Realm创建一个新的领域实例 [...]。如果 Realm 尚不存在 [...],则此构造函数将创建它。否则,实例将访问现有的 Realm

在 React 示例中,他们使用新的:https : //github.com/realm/realm-js/blob/master/examples/ReactExample/components/realm.js

javascript realm react-native

5
推荐指数
1
解决办法
4749
查看次数

标签 统计

react-native ×2

flexbox ×1

javascript ×1

realm ×1