Question

import 'package:duck/MoreAboutProduct.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class CategoryComponents extends StatelessWidget {
  final String NAME;
 CategoryComponents(
  this.NAME);

    @override
  Widget build(BuildContext context) {
    return Column(
     children:[
       Text($NAME),
       RaisedButton( 
child : Text(More Info),

onPressed:(){

Navigator.of(context).push(MaterialPageRoute(builder: (context) {
    return MoreAboutProduct(
    NAMEp: NAME,

}
    ),
    ],);

我有一个名为CategoryComponents的类，在此示例“ NAME”中只有1个变量，而其他类名为Samsung和MoreAboutProduct，我将在下面的行中添加其他人的代码，我想在Samsung中调用CategoryComponents类并传递NAME的值和其他值（为简单起见，在此示例中未显示其他值），我想在Samsung类中显示NAME的值，它们将是CategoryComponents类的底部，这将我转移到MoreAboutProduct类，并显示更多有关该产品的信息，但是某些数据仅适用于第一个产品，这就是为什么我需要在Samsung和MoreAboutProduct之间建立连接，我找到了一种实现方法，但是我确实在理解代码（尤其是Navigator部件）以及变量如何在其中存在一些问题可以在MoreAboutProduct类中访问在Samsung类的构造函数的参数中传递的CategoryComponents？还有widget.NAME部分，我知道这是一个很长的问题，但是如果您想投反对票，请先给我一个答案。

import 'package:duck/MoreAboutProduct.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'CategoryComponents.dart';

class Samsung extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _x,
      appBar: myAppbar("Samsung"),
      body: FutureBuilder(
        future: getData(),
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            return ListView.builder(
                itemCount: snapshot.data.length,
                itemBuilder: (context, index) {
                  return CategoryComponents(
                    snapshot.data[index]['NAME']
)};

这是Samsung类，它们是我要传递的其他参数，但在此示例中仅使它们简单化，以便您理解我的要求，这也是我使用ListView.builder的原因。

import 'package:duck/myAppbar.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'myCarousel.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';

class MoreAboutProduct extends StatefulWidget {
  final String NAMEp;
MoreAboutProduct(
  {this.NAMEp});
}
 @override
  _MoreAboutProductState createState() => _MoreAboutProductState();
}

class _MoreAboutProductState extends State<MoreAboutProduct> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: ...,
      body: Column(
        children: [
         ...
          ),
          Expanded(
            child: Container(
              child: ListView.builder(
                itemCount: widget.snapshotLengthp,
                itemBuilder: (context, index) {
                  return Container(
                    child: Column(
                      children: [
                        SpecificationsDetails(context, 'NAME', widget.NAMEp),
....
],
),);},),),),),);

SpecificationsDetails是负责样式设置的功能，无需显示。

这是一些示例运行：

This image is in Samsung class but Categorycomponents class is responsible for passing data to it and the styling

And this is in MoreAboutProduct class

Answer 1

您可以在应用中创建命名路线。

MaterialApp(
  // Start the app with the "/" named route. In this case, the app starts
  initialRoute: '/',
  routes: {
    '/': (context) => HomePage(),
    '/more_about_products': (context) => MoreAboutProduct(),
    
    '/samsung': (context) => Samsung(),
  },
);

flutter文档中的代码。

在类别组件类中，您可以具有以下内容：

 Navigator.of(context).pushNamed("/more_about_products", arguments = {name: this.NAME});

之后，您可以使用ModalRoute在MoreAboutProducts中获取此参数，如下所示：

class _MoreAboutProductState extends State<MoreAboutProduct> {
  @override
  Widget build(BuildContext context) {

    final args = ModalRoute.of(context).settings.arguments;
    // to grab the **name** argument use ***args.name*** like in print function below.
    print(args.name)
    return Scaffold(
      appBar: ...,
      body: Column(
        children: [
         ...
          ),
          Expanded(
            child: Container(...etc code....

请阅读打印功能和ModalRoute之间的注释。

有关更多信息，请查看flutter named routes和passing the arguments to named routes

有状态小部件中的widget.something

1 个答案: