先看下成功后的效果图吧:
![img_536c8d07f0dd25cd4d01188057bd4a21.png](https://i-blog.csdnimg.cn/blog_migrate/d206bcc4efc9ac64f88a8c8d98a039a0.png)
image.png
问题1:
在引入这个组件的时候,运行在真机上 运行不了,报这个错误
![img_14620ca339d9d2e84ad4a10e86ca2cc6.png](https://i-blog.csdnimg.cn/blog_migrate/90790053c9ad966f583118fb9246c00b.png)
image.png
网上找了答案 是要添加动态 报 ,然后试了试加了下
![img_218f8818b7c664b3e58dfd337e9e8194.png](https://i-blog.csdnimg.cn/blog_migrate/bd8aae2ba8e1058fca8c608cb92f008c.png)
image.png
![img_8b3d81cbea226320eed59852136e6ad2.png](https://i-blog.csdnimg.cn/blog_migrate/3aa1055029cf880f75b7c0372534a1f7.png)
image.png
并没有什么用。。。。。然后试了下把required 改成optional 在真机上可以跑了,optional :按需加载的意思吧
到最后用到这个组件的时候,上传和选择照片的时候,问题又来了,最后看了下 这个组件的git上的介绍 https://github.com/ivpusic/react-native-image-crop-picker 然后结合相关资料看了下,又重新配置了下
1.把node_modules / react-native-image-crop-picker /下的ImageCropPickerSDK 拖到Xcode工程的根目录下。
![img_d8d2b5074e716743169a1131c8d133a7.png](https://i-blog.csdnimg.cn/blog_migrate/09444947733a2997f9f8c3fd2d354b86.png)
![img_2caca6df2a8ebe083c03153e58e20eef.png](https://i-blog.csdnimg.cn/blog_migrate/e60401bd27305c01bc81bebc76907dd7.png)
image.png
这里把包导入后 感觉万事 OK 了 可再用的时候,xcode又报了这个错误:
![img_ab86fed4c06a71b505b8ca6a2767ff83.png](https://i-blog.csdnimg.cn/blog_migrate/2c00b307186c104bc441647e46ece92f.png)
image.png
这个错误的大概意思就是:视图不在 windows 上 ,第一次可以,然后再次点击上传的时候却不行。。。。
坑爹,这怎么下手找问题呢?
记得 ,以前我们的老大,同事说过,碰到莫名其妙问题,加个延时:(一开始延迟写的是300不行,后来写了1s可以了,哎,好坑爹折腾了好久)
//拍照
openCamera() {
setTimeout(() => {
ImagePicker.openCamera({
width: 476,
height: 476,
cropping: true,
// multiple:true
}).then(image => {
let path = image.path;
const source = { uri: path };
this.setState({
file: this.state.file.concat([source]),
},
);
}, err => {
console.log('err= ' + err);
}).catch(err => {
console.log('image catch err= ' + err);
});
}, 1000)
}
openPicker() {
setTimeout(() => {
ImagePicker.openPicker({
width: 476,
height: 476,
cropping: true, //是否裁剪
// multiple:true
}).then(image => {
let path = image.path;
const source = { uri: path };
this.setState({
file: this.state.file.concat([source]),
});
// this.uploadAvatar(path);
}, err => {
console.log('err= ' + err);
}).catch(err => {
console.log('image catch err= ' + err);
});
}, 1000)
}
后来分析了下 ,可能是我用的RN的modal 异步state关闭时候问题,只是猜测~
根据这个思路,去验证了下 在setState 里加了个回调,还是不行,报同样的错误。
先记录到这吧~ 抓紧赶项目了!