Question

前言：我还想推迟实施Redux商店因为它似乎相当深入，我不确定我是否还需要它（也是，项目范围/预算就是这样。）

我正在使用反应导航（堆栈导航器），并且我试图找出为列表视图预加载/存储数据的最佳做法（在我的情况下约为40项）？我有一个主主屏幕，用户导航到的第二个屏幕是一个列表视图（FlatList）。 FlatList的数据来自本地文件中的JSON对象。如果我像这样导入屏幕组件中的数据：

<!DOCTYPE html>
<html>
<?php
    $option = array();
    $option['driver'] = 'mssql';
    $option['host'] = '555.24.24.18';
    $option['user'] = 'user';
    $option['password'] = 'password';
    $option['database'] = 'database1';
    $option['prefix'] = '';
    $db = JDatabase::getInstance($option);
    $query = $db->getQuery(true);
?>
<table frame="hsides" style="color:#ffffff;" border="1">
    <thead>
        <tr>
            <th>Header 1 </th>
            <th>Header 2 </th>
            <th>Header 3 </th>
            <th>Header 4 </th>
            <th>Header 5 </th>
            <th>Header 6 </th>
            <th>Header 7 </th>
            <th>Header 8 </th>
            <th>Header 9 </th>
            <th>Header 10 </th>
            <th>Header 11 </th>
            <th>Header 12 </th>
            <th>Header 13 </th>
            <th>Header 14 </th>
            <th>Header 15 </th>
        </tr>
    </thead>
    <?php
        $query1 = //Select statement goes here
        $db->setQuery($query1);
        $query1 = $db->loadObjectList();
        if ($query1) 
        {
            if ($query1->num_rows > 0) 
            {
                foreach ($query1 as $res) 
                {
                    print "<tr>";
                    print "<td>" . $res->field1 . "</td>";
                    print "<td>" . $res->field2 . "</td>";
                    print "<td>" . $res->field3 . "</td>";
                    print "<td>" . $res->field4 . "</td>";
                    print "<td>" . $res->field5 . "</td>";
                    print "<td>" . "$" . round($res->field6) . "</td>";
                    print "<td>" . "$" . round($res->field7) . "</td>";
                    print "<td>" . "$" . round($res->field8) . "</td>";
                    print "<td>" . "$" . round($res->field9) . "</td>";
                    print "<td>" . "$" . round($res->field10) . "</td>";
                    print "<td>" . "$" . round($res->field11) . "</td>";
                    print "<td>" . "$" . round($res->field12) . "</td>";
                    print "<td>" . "$" . round($res->field13) . "</td>";
                    print "<td>" . round($res->field14) . "%" . "</td>";
                    print "<td>" . round($res->field15) . "%" . "</td>";
                    print "</tr>";
                }
            } 
            else          
            {
                echo "Empty Table.";
            }
        }
    ?>
</table>
</html>

它不会导致我正在寻找的即时/零延迟加载。也就是说 - 在没有数据导入的情况下导航是即时的 - 但直接在屏幕文件中导航和导入该数据会导致触摸导航和实际启动导航动画的应用之间的延迟。

我想我应该预先加载数据，理想情况是应用程序首次加载时，然后从某个全局变量访问它 - 或者将它作为导航器中的prop传递？然后我可以在屏幕组件中使用this.props.data访问它吗？

我没有从用户那里获取任何数据 - 该应用程序纯粹是信息性的，所以我不认为AsyncStorage也是答案吗？（虽然我可能错了，看起来我看到的每个asyc存储教程都是关于用户输入的。）

非常感谢对此的任何见解！

Answer 1

我正在走完完全错误的兔子洞。每个屏幕导入数据没有错。我在开发模式下运行Expo！

React Native / React导航性能：存储/传递列表视图数据的最佳实践？

1 个答案: