【问题标题】:Reading specific items from json in flutter从 json 中读取特定项目
【发布时间】:2022-11-27 06:17:41
【问题描述】:

嗨,我有包含近 30 个项目的 json,我只想在列表视图中显示 10 个项目,每次刷新页面时都应该从 json 中选择更改(换句话说,随机项目)。

如果有人可以举例说明,有什么办法会很棒。

谢谢

【问题讨论】:

  • 你能提供一个你到目前为止所取得的成就的代码 sn-p 和一个示例 json 吗?
  • itemCount: yourJson.length < 10 ? yourJson.length : 10, 这样的东西怎么样——我在stackoverflow.com/a/68153079/6188976 上找到了这个

标签: json flutter parsing


【解决方案1】:

将 json 文件放在名为 assets 的文件夹中:

Image

将此添加到 pubspec.yaml:

assets:
    - assets/

Image

main.dart 文件:

import 'dart:convert';
import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  List items = [];
  int itemCount = 2;


  Future<void> readJson() async {
    final String response = await rootBundle.loadString('assets/items.json');
    final data = await json.decode(response);
    setState(() {
      items = data["items"];
    });
  }

  @override
  void initState() {
    super.initState();

    readJson();
  }

  String randomItem() {
    int random = Random().nextInt(items.length);
    print(random);
    String item = items[random]["item"];
    items.removeAt(random);
    return item;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("Title"),
      ),
      body:

      items.isNotEmpty ? Center(
        child: ListView.builder(
          shrinkWrap: true,
          scrollDirection: Axis.vertical,
          itemCount: itemCount,
          itemBuilder: (context, index) => Column(
            children: [
              Text(randomItem()),
            ],
          ),
        ),
      ): const Text("Loading..."),

    );
  }
}

杰森文件:

{
  "items": [
    {
      "item": "One"
    },
    {
      "item": "Two"
    },
    {
      "item": "Three"
    }
  ]
}

这会从 json 文件中随机选择两个字符串。

itemCount 变量不能长于 json 文件中的项目数。如果您想要 10 个不同的项目,请将其更改为 10。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2017-06-08
    • 2022-10-24
    • 1970-01-01
    • 2022-01-20
    • 1970-01-01
    • 2015-09-03
    相关资源
    最近更新 更多