小编Mos*_*mer的帖子

我希望能够知道已经传入的网络加载图像的实际大小<Image />我已经尝试使用onLayout来计算大小(从这里开始https://github.com/facebook/react-native/问题/ 858)但这似乎在已经通过布局引擎推送之后返回已清理的大小.

我试着查看onLoadStart,onLoad,onLoadEnd,onProgress以查看是否有其他可用信息,但似乎无法解决任何这些问题.我当时声明如下:

  onImageLoadStart: function(e){
    console.log("onImageLoadStart");
  },

  onImageLoad: function(e){
    console.log("onImageLoad");
  },

  onImageLoadEnd: function(e){
    console.log("onImageLoadEnd");
  },


  onImageProgress: function(e){
    console.log("onImageProgress");
  },

  onImageError: function(e){
    console.log("onImageError");
  },

  render: function (e) {
    return (
      <Image
        source={{uri: "http://adomain.com/myimageurl.jpg"}}
        style={[this.props.style, this.state.style]}
        onLayout={this.onImageLayout}
        onLoadStart={(e) => {this.onImageLoadStart(e)}}
        onLoad={(e) => {this.onImageLoad(e)}}
        onLoadEnd={(e) => {this.onImageLoadEnd(e)}}
        onProgress={(e) => {this.onImageProgress(e)}}
        onError={(e) => {this.onImageError(e)}} />
    );
  }

谢谢.

我正在查看React-Native中的navigator组件,但无法接受已经在堆栈中的子节点.例如,如果我们以Facebook应用程序为例.用户可以搜索用户,然后单击"朋友",然后单击其他用户.当我尝试将错误添加到堆栈时,这会崩溃

Invariant Violation: Expected a component class, got [object Object].

我通过标准导航器和当前的React-Native-Router尝试了这个.我目前的代码看起来像这样

class OptionsBranch extends Component {
    render() {
        /*<TouchableHighlight style={styles.spaceOut} onPress={() => {this.props.toRoute({name:"test", component:UserProfile})}}><Text>[push]</Text></TouchableHighlight>*/
        return (
            <View style={styles.container}>
                <Text>[OptionsScreen]</Text>
                <TouchableHighlight style={styles.spaceOut} onPress={() => {this.props.toRoute({id:"x", name:"test", component:UserProfile})}}><Text>[push]</Text></TouchableHighlight>
                <TouchableHighlight style={styles.spaceOut} onPress={() => {this.props.toBack()}}><Text>[pop]</Text></TouchableHighlight>
            </View>
        );
    }
}

只要我从不重复使用课程,我就能无限期地工作.我做的那一刻,我得到了错误.

我会发布链接到研究,但除了框架中包含的样本之外,Navigator(而不是NavigatorIOS)没有多少,他们似乎实现了ti,但没有通过我需要的完整路线.

例如

<NavButton onPress={() => { navigator.push(_getRandomRoute()) }} text="Push"/>

如果我尝试在我的代码中使用它(没有React-Native-Router),即

<TouchableHighlight onPress={() => { this.props.navigator.push({ name:"myComponent", component:myComponent }) }} />

它也错了.

为什么是这样？这是Navigator的限制吗？这是我的代码中的错误吗？

使用TabBar和Navigator的Boiler plate应用可能非常有用.NavigatorIOS对定制有点限制.

我在我的index.ios.js文件中实例化如下:

render() {
    return(
      <Navigator
        style={styles.navigator}
        renderScene={this.renderScene}
        initialRoute={{
          component: test,
          navigationBar: <NavigationBar title="home" />
        }}/>
    );
}

从这个相同的文件我有一个功能,我希望能够在导航器上触发一个动作,例如

resetStack(){
  // navigator.popToTop();
}

我该如何实现这一目标？我以为我必须使用名为refs的东西,并尝试添加如下引用:

render() {
    return(
      <Navigator
        ref="ref1"
        style={styles.navigator}
        renderScene={this.renderScene}
        initialRoute={{
          component: test,
          navigationBar: <NavigationBar title="home" />
        }}/>
    );
}

然后调用它:resetStack(){// navigator.popToTop(); ref1.popToTop(); }

但是这会导致错误:无法找到变量ref1

我该如何实现这一目标？如何触发子组件中的方法？

我正在尝试将几个调用链接到AsyncStorage.getItem(),但似乎无法以正确的顺序触发调用.我似乎设法在早期项目之前完成最后一项完成后退出循环.似乎React使用与promise相同的语法而不是jQuery的工作方式.

在这个例子中,我试图链接调用以获取vars v1,v2,v3.v3触发刷新需要vars v1和v2的UI.我的两个链式变量的代码如下:

AsyncStorage.getItem("v1")
.then(
    (value) => {
        if (value !== null){
            varCollection.v1 =value
        }
    }
)
.then( () => {
    AsyncStorage.getItem("v3")
    .then((value) => {
        if (value !== null){
            varCollection.v3 = value;
        }else{
            varCollection.v3 = "default value";
        }
    })
    .done()
})
.done();

这似乎工作,但它可能只是运气导致它工作,因为当我添加链的另一个链接,出现问题.

AsyncStorage.getItem("v1")
.then(
    (value) => {
        if (value !== null){
            varCollection.v1 =value
        }
    }
)
.then( () => {
    AsyncStorage.getItem("v2")
    .then((value) => {
        if (value !== null){
            varCollection.v2 = value;
        }
    })
    .done()
})
.then( () => …