Flutter for OpenHarmony前置知识《Flutter 网络请求实战：从零实现一个完整的 API 测试页面》

dependencies:
  flutter:
    sdk: flutter
  http: ^1.2.0

flutter pub get

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

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

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: '网络请求测试',
      theme: ThemeData(primarySwatch: Colors.blue),
      home: const NetworkTestPage(),
    );
  }
}

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

  @override
  State<NetworkTestPage> createState() => _NetworkTestPageState();
}

class _NetworkTestPageState extends State<NetworkTestPage> {
  String _responseText = '点击按钮发起请求';
  bool _isLoading = false;

  Future<void> _fetchData() async {
    setState(() {
      _isLoading = true;
      _responseText = '加载中...';
    });

    try {
      final response = await http.get(
        Uri.parse('https://jsonplaceholder.typicode.com/posts/1'),
      );

      if (response.statusCode == 200) {
        final data = jsonDecode(response.body) as Map<String, dynamic>;
        setState(() {
          _responseText = '标题: ${data['title']}\n\n内容: ${data['body']}';
        });
      } else {
        setState(() {
          _responseText = '请求失败，状态码: ${response.statusCode}';
        });
      }
    } catch (e) {
      setState(() {
        _responseText = '网络错误: $e';
      });
    } finally {
      setState(() {
        _isLoading = false;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('网络请求测试')),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            ElevatedButton(
              onPressed: _fetchData,
              child: const Text('获取文章'),
            ),
            const SizedBox(height: 20),
            if (_isLoading)
              const CircularProgressIndicator()
            else
              Expanded(
                child: SingleChildScrollView(
                  child: Text(_responseText),
                ),
              ),
          ],
        ),
      ),
    );
  }
}

final response = await http.get(
  Uri.parse('https://jsonplaceholder.typicode.com/posts/1'),
);

final data = jsonDecode(response.body) as Map<String, dynamic>;

try { ... } catch (e) { ... } finally { ... }

标题: sunt aut facere repellat provident occaecati excepturi optio reprehenderit

内容: quia et suscipit suscipit recusandae consequuntur expedita et cum reprehenderit molestiae ut ut quas totam nostrum rerum est autem sunt rem eveniet architecto