如何解决扩展React本机Web视图的设计
我想围绕react-native webview创建一个包装器,以便提供一些默认值,客户端可以覆盖它们。我还想提供方法的默认实现
例如:
<MyBaseWebView uri ={provided by user of MyBaseWebView}>
MyBaseWebView can have default implementations for onError etc.
我一直在使用props从客户端发送各种替代信息,但我该怎么做:
-
ref={this.setRNWebView}
仅需在一个孩子中使用 -
injectedJavaScript={this.injectedJavaScript()}
如果客户端不发送任何JavaScript,我根本就不想注入。我该如何实现?
BaseWebView类如下所示:
<WebView
allowsInlinemediaplayback={this.allowsInlinemediaplayback()}
ref={this.setRNWebView}
source={{uri: uri}} // from prop
mediaplaybackRequiresUserAction={this.mediaplaybackRequiresUserAction()}
onMessage={this.onMessage}
onError={this.onError}
onLoad={this.onLoad}
injectedJavaScript={this.injectedJavaScript()}
/>
解决方法
听起来像是您需要添加state
变量,可能是在Web视图之前的屏幕上。
constructor(props) {
super(props);
this.state = {
uri: "www.defaultUri.com",injectedJavascript: "",};
}
//then for example in a textInput in render() you could allow your
//user to update these values
<TextInput
value={this.state.uri}
onChangeText={text => this.setState({uri: text})}/>
您可以对injectedJavascript
或任何其他变量执行相同的操作,并且当用户点击“提交”或某些操作时,可以将这些状态变量作为道具传递给webview
。
让我知道这是否不是您要查找的内容或不够清晰。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。