在存储中反应本机 setItem [英] React Native setItem in storage

查看：44
本文介绍了在存储中反应本机 setItem的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我有一个 forEach 循环如下:

let result_test = [];forEach(result_to_upload, value => {如果(值.图片路径){让 body = new FormData();常量照片 = {uri:value.picturepath，类型:'图像/jpeg'，名称:value.pictureguid + '.jpg',};body.append('图片', 照片);让 xhr = 新的 XMLHttpRequest();xhr.open('POST', data_url + "/manager/transport/sync/picture/?pictureguid=" + value.pictureguid);xhr.onload = (e) =>{如果(xhr.readyState === 4){如果(xhr.status === 200){result_test.push({"vehicle_id": value.vehicle_id,slot_id":value.slot_id，区域":value.area，区域":value.zone，过道":价值.过道，边":价值.边，col":value.col，级别":值.级别，位置":值.位置，时间戳":value.timestamp，图片路径":value.picturepath，pictureguid":value.pictureguid，原因":价值.原因，处理":value.handled，上传":1});}}};xhr.onerror = (e) =>console.log('错误');xhr.send(body);} 别的 {result_test.push({"vehicle_id": value.vehicle_id,slot_id":value.slot_id，区域":value.area，区域":value.zone，过道":价值.过道，边":价值.边，col":value.col，级别":值.级别，位置":值.位置，时间戳":value.timestamp，图片路径":value.picturepath，pictureguid":value.pictureguid，原因":价值.原因，处理":value.handled，上传":1})}});AsyncStorage.setItem('vehicle_slot', JSON.stringify(result_test), () => s_cb())

上传结果如下:

<预><代码>[{走道:""区域:""category_text: "CT"第 2 列color_text:"银色"评论:""已处理:0等级:0make_text:"标致"模型文本:208"图片指南:88e6a87b-b48b-4bfd-b42d-92964a34bef6"图片路径:"/Users/boris/Library/Developer/CoreSimulator/Devices/E5DB7769-6D3B-4B02-AA8F-CAF1B03AFCB7/data/Containers/Data/Application/DBCFB503-F8E1-42FF-8C2B-260A713AF7D80C/40A713AF7D80C40C408122-53D9A0F4A88E.jpg"位置:0原因:输入"参考:""登记:""侧面:E"slot_id:2358标签文本:""时间戳:201705021714"上传:0车辆编号:1vin:123456"区域:A"},{走道:""区域:""category_text: "CT"第 2 列color_text:"银色"评论:""已处理:0等级:0make_text:"高尔夫"模型文本:208"图片指南:88e6a87b-b48b-4bfd-b42d-92964a34bef6"图片路径:""位置:0原因:输入"参考:""登记:""边:B"slot_id:2358标签文本:""时间戳:201705021714"上传:0车辆编号:1vin:123456"区域:A"}]

但由于某种原因是 AsyncStorage.getItem("vehicle_slot").then(json => console.log(JSON.parse(json)) 只有第二个对象，第一个是未添加到存储中.

有什么建议吗?

解决方案

您的 XMLHttpRequest 将异步运行.您的代码完全有可能到达 

AsyncStorage.setItem('vehicle_slot', JSON.stringify(result_test), () => s_cb())

before onload 事件已经发生，因为只有在请求完成时才会发生.您应该添加 setItem 作为回调.

resultToUpload.forEach(result => {如果(结果.图片路径){//在这里处理东西让 xhr = 新的 XMLHttpRequest();xhr.onload = (e) =>{//处理其他事情result_test.push(/* 数据 */);等待 storeInAsyncStorage(result_test, () => s_cb());};} 别的 {//处理更多的东西result_test.push(/* 不同的数据 */);等待 storeInAsyncStorage(result_test, () => s_cb());}});函数 storeInAsyncStorage(数据，回调){如果(回调){return AsyncStorage.setItem(JSON.stringify(data), callback);} 别的 {返回 AsyncStorage.setItem(JSON.stringify(data));}}

您还应该知道AsyncStorage.setItem 是异步.该项目不会立即设置，并且 setItem 方法返回一个承诺，该承诺在项目设置时解析.如果您没有将它传递给其他函数，请尝试使用 await AsyncStorage.setItem.

I have an forEach loop as follows:

let result_test = [];
forEach(result_to_upload, value => {
  if (value.picturepath) {
    let body = new FormData();
    const photo = {
      uri: value.picturepath,
      type: 'image/jpeg',
      name: value.pictureguid + '.jpg',
    };
    body.append('image', photo);
    let xhr = new XMLHttpRequest();
    xhr.open('POST', data_url + "/manager/transport/sync/picture/?pictureguid=" + value.pictureguid);
    xhr.onload = (e) => {
      if (xhr.readyState === 4) {
        if (xhr.status === 200) {
          result_test.push(
            {
              "vehicle_id": value.vehicle_id,
              "slot_id": value.slot_id,
              "area": value.area,
              "zone": value.zone,
              "aisle": value.aisle,
              "side": value.side,
              "col": value.col,
              "level": value.level,
              "position": value.position,
              "timestamp": value.timestamp,
              "picturepath": value.picturepath,
              "pictureguid": value.pictureguid,
              "reason": value.reason,
              "handled": value.handled,
              "uploaded": 1
            }
          );
        }
      }
    };
    xhr.onerror =  (e) => console.log('Error');
    xhr.send(body);
  } else {
    result_test.push(
      {
        "vehicle_id": value.vehicle_id,
        "slot_id": value.slot_id,
        "area": value.area,
        "zone": value.zone,
        "aisle": value.aisle,
        "side": value.side,
        "col": value.col,
        "level": value.level,
        "position": value.position,
        "timestamp": value.timestamp,
        "picturepath": value.picturepath,
        "pictureguid": value.pictureguid,
        "reason": value.reason,
        "handled": value.handled,
        "uploaded": 1
      }
    )
  }
});
AsyncStorage.setItem('vehicle_slot', JSON.stringify(result_test), () => s_cb())

And result to upload is as follows:

[
    {
    aisle:""
    area:""
    category_text: "CT"
    col:2
    color_text:"Argent"
    comment:""
    handled:0
    level:0
    make_text:"Peugeot"
    model_text:"208"
    pictureguid:"88e6a87b-b48b-4bfd-b42d-92964a34bef6"
    picturepath:
    "/Users/boris/Library/Developer/CoreSimulator/Devices/E5DB7769-6D3B-4B02-AA8F-CAF1B03AFCB7/data/Containers/Data/Application/DBCFB503-F8E1-42FF-8C2B-260A713AF7BC/Documents/2D840EFA-014C-48C0-8122-53D9A0F4A88E.jpg"
    position:0
    reason:"ENTER"
    reference:""
    registration:""
    side:"E"
    slot_id:2358
    tag_text:""
    timestamp:"201705021714"
    uploaded:0
    vehicle_id:1
    vin:"123456"
    zone:"A"
  },
  {
    aisle:""
    area:""
    category_text: "CT"
    col:2
    color_text:"Argent"
    comment:""
    handled:0
    level:0
    make_text:"Golf"
    model_text:"208"
    pictureguid:"88e6a87b-b48b-4bfd-b42d-92964a34bef6"
    picturepath:""
    position:0
    reason:"ENTER"
    reference:""
    registration:""
    side:"B"
    slot_id:2358
    tag_text:""
    timestamp:"201705021714"
    uploaded:0
    vehicle_id:1
    vin:"123456"
    zone:"A"
  }
]

But for some reason is AsyncStorage.getItem("vehicle_slot").then(json => console.log(JSON.parse(json)) only the second object, the first one is not added to storage.

Any advice?

解决方案

your XMLHttpRequest is going to run asynchronously. It's perfectly possible that your code might get to the 

AsyncStorage.setItem('vehicle_slot', JSON.stringify(result_test), () => s_cb())

before the onload event has occurred, since that only happens when the request is done. You should add the setItem as a callback.

resultToUpload.forEach(result => {
    if (result.picturepath) {
      // handle stuff here
      let xhr = new XMLHttpRequest();
      xhr.onload = (e) => {
        // handle other stuff
        result_test.push(/* data */);
        await storeInAsyncStorage(result_test, () => s_cb());
      };
   } else {
     // handle even more stuff
     result_test.push(/* different data */);
     await storeInAsyncStorage(result_test, () => s_cb());
   }
});

function storeInAsyncStorage(data, callback) {
  if(callback) {
    return AsyncStorage.setItem(JSON.stringify(data), callback);
  } else {
    return AsyncStorage.setItem(JSON.stringify(data));
  }
}

You should also be aware that AsyncStorage.setItem is asynchronous. The item does not get set immediately, and the setItem method returns a promise that resolves when the item is set. Try using await AsyncStorage.setItem if you're not passing it into some other function.

这篇关于在存储中反应本机 setItem的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文
相关文章
其他开发最新文章
热门教程
热门工具
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆