Flutter Web - 设置状态 - 文件选择器 - 文件选择器选择文件时不显示文件名/文件名。 SetState 是否正确应用？

Question

我对 flutter 和编码还很陌生。这可能是一个简单的修复，但我无法在任何地方找到解决方案或重新配置代码以显示我正在选择的文件的名称。

我正在尝试创建一个可以接受文档提交的网页。但是，我无法获得显示所选文件名称的代码。

打印调用正常，但 fileNameSelected 没有更新。

感谢您的帮助！！

import 'dart:html';
import 'dart:io' as io; //type cast

import 'package:firebase_storage/firebase_storage.dart';
import 'package:flutter/material.dart';
import 'package:file_picker/file_picker.dart';
import 'package:path/path.dart';

import './appbar/appbar.dart';

class UploadFPage extends StatefulWidget {
  const UploadFPage({Key? key}) : super(key: key);

  @override
  State<UploadFPage> createState() => _UploadFPageState();
}

class _UploadFPageState extends State<UploadFPage> {
  UploadTask? task;
  File? file;
  String fileNameSelected = 'No File Selected';

  @override
  Widget build(BuildContext context) {
    final fileName = fileNameSelected;

    return Scaffold(
      appBar: AppBar(
        title: const Text('AppBar'),
      ),
      body: ListView(
        children: [
          Container(
            height: 300,
            color: Colors.amber,
            child: Row(
              children: [
                ElevatedButton.icon(
                  icon: const Icon(Icons.attach_file, size: 28),
                  onPressed: selectFile,
                  label: Text("Attach Invoice"),
                ),
                Text(fileName),
              ],
            ),
          ),
        ],
      ),
    );
  }

  Future selectFile() async {
    FilePickerResult? result = await FilePicker.platform.pickFiles(
        type: FileType.custom,
        allowMultiple: false,
        allowedExtensions: ['pdf']);

    if (result == null) {
      return;
    } else {
      print(result.files.single.name);
      //final name = result.files.single.name;
      //final path = result.files.single.path!;
      //final file = result.files.single.bytes!;

      setState(() {
        String fileNameSelected = basename(result.files.single.name);
        //file = File(size, path);
      });
    }
  }
}

Answer 1

变化：

  setState(() {
    String fileNameSelected = basename(result.files.single.name);
  });

到

  setState(() {
    fileNameSelected = basename(result.files.single.name);
  });

通过在前面添加 var、final 或 String，您声明了一个新变量（恰好与您在上面声明的变量同名）。您将您选择的文件分配给它 - 它会立即超出范围。

Flutter Web - 设置状态 - 文件选择器 - 文件选择器选择文件时不显示文件名/文件名。 SetState 是否正确应用？

Flutter Web - Set State - File Picker - File Name / File Name is not showing when File Picker picks file. Is SetState applied correctly?

setstate

flutter

flutter-web