Question

我的应用程序中有一个用户首选项屏幕，其中的数据使用asyncStorage进行管理。每当我更改首选项中的某些值时，我都需要在应用程序的其他屏幕中反映该更改。但是它不会立即显示更改，而是在我重新加载应用程序时显示更改。我该怎么办 ..？

我正在使用multiGet()和ComponentWillMount()中的ComponentDidMount()来获取数据，并使用drawerNavigation在屏幕之间进行转换。

我什至尝试使用全局变量来反映更改，但是我没有帮助。我应该使用redux吗？我该怎么办？预先感谢。

Answer 1

使用async-await从asyncStorage中获取数据

像这样

<!DOCTYPE html>
<html>
<head lang="en">
   <meta charset="utf-8">
   <title>Activity Log</title>
   <script>

      // Wait until the window finishes loaded before executing any script
      window.onload = function() {

        // Initialize the activityNumber
        var activityNumber = 6;

        // Select the add_activity button
        var addButton = document.getElementById("add_activity");

        // Select the table element
        var tracklistTable = document.getElementById("tracklist");

        // Attach handler to the button click event
        addButton.onclick = function() {

			// Add a new row to the table using the correct activityNumber
          tracklistTable.innerHTML += '<tr><td>' + activityNumber + '</td><td><label>Activity Log: </label><br/><input type="text" name="actlog' + activityNumber + '" class="required"></td><td><label>Time: </label><br/><input type="time" name="time' + activityNumber + '" class="required"></td></tr>';

          // Increment the activityNumber
          activityNumber += 1;
        }
	

      }

   </script>

</head>

<body>
  <div class="container">
      <div class="row">
          <div class="leftcol">
              <form name='mainForm' id='mainForm' method="get" action="#">
                <fieldset>
                   <legend>Input Activity Logs</legend>
                   <table id="tracklist">
                    <tr>
                      <th colspan="3">Track List: </th>
                    </tr>
                    <tr>
                      <td>1</td>
                      <td><label>Activity Log: </label><br/><input type="text" name="actlog1" class="required"></td>
                      <td><label>Time: </label><br/><input type="time" name="time1" class="required"></td>
                    </tr>
                    <tr>
                      <td>2</td>
                      <td><label>Activity Log: </label><br/><input type="text" name="actlog2" class="required"></td>
                      <td><label>Time: </label><br/><input type="time" name="time2" class="required"></td>
                    </tr>
					<tr>
                      <td>3</td>
                      <td><label>Activity Log: </label><br/><input type="text" name="actlog3" class="required"></td>
                      <td><label>Time: </label><br/><input type="time" name="time3" class="required"></td>
                    </tr>
					<tr>
                      <td>4</td>
                      <td><label>Activity Log: </label><br/><input type="text" name="actlog4" class="required"></td>
                      <td><label>Time: </label><br/><input type="time" name="time4" class="required"></td>
                    </tr>
					<tr>
                      <td>5</td>
                      <td><label>Activity Log: </label><br/><input type="text" name="actlog5" class="required"></td>
                      <td><label>Time: </label><br/><input type="time" name="time5" class="required"></td>
                    </tr>
                   </table>
				   
                   <input type="submit" />
                </fieldset>
              </form>
              <button id="add_activity">Add Activity</button>
          </div>
      </div>
  </div>
</body>
</html>

在抽屉导航的react-native中从`asyncStorage`中获取数据较晚

1 个答案: