captureRef webview ref error
when i use captureRef handle Error: Argument appears to not be a ReactComponent. Keys: goForward,goBack,reload,stopLoading,postMessage,injectJavaScript,requestFocus,clearCache, js engine: hermes
"dependencies": { "@react-native-camera-roll/camera-roll": "^7.8.1", "react": "18.2.0", "react-native": "0.73.6", "react-native-view-shot": "^3.8.0", "react-native-webview": "^13.10.3" },
code is:
<WebView
scrollEnabled={true}
ref={webRef}
source={{
uri: 'https://baidu.com',
}}
onMessage={event => {
let message = event.nativeEvent.data;
console.log('webview:', message, webRef);
if (message === 'img') {
// setBtnDisabled(false);
return;
}
setAutoHeight(Number(message));
setTimeout(() => {
captureRef(webRef, {
format: 'jpg',
quality: 0.8,
})
.then(uri => {
CameraRoll.saveAsset(uri, {type: 'photo'})
.then((val: any) => {
console.log('Image saved to', val);
})
.catch((err: any) => {
console.log('save error', err);
});
})
.catch(err => {
console.log('xxxx:', err);
});
}, 1000);
}}
/>
<Button
title="Cut Page"
onPress={() => {
const js = var height = document.body.scrollHeight; window.ReactNativeWebView.postMessage(height); true;;
if (webRef && webRef.current) {
webRef1.current.injectJavaScript(js);
}
}}
/>
@mrcao2011 Have you found any solution for this?
@rohitatcoffee you can use view to wrap webview to solve it,for example:<View>< WebView /></View>