flutter 命名路由跳轉傳值

2022-06-14 09:57:12 字數 1569 閱讀 8182

flutter中給我們提供了兩種配置路由跳轉的方法:

- 基本路由:需要在跳轉的模組匯入需要跳轉的路由

- 命名路由:直接在main.dart中配置,其他元件可以直接呼叫

import 'pages/form.dart';

import 'pages/search.dart';

class

@override

widget build(buildcontext context) ,

);}}

(2)使用路由跳轉

示例:在乙個按鈕點選事件中跳轉路由:

raisedbutton(

child: text(

"跳轉搜尋頁面"),

onpressed: () ,

),

(1)main.dart配置

import '

package:flutter/material.dart';

import

'package:learn_demo/pages/search.dart';

import

'./pages/tabs.dart';

import

'pages/form.dart';

import

'pages/search.dart';

void main()

//自定義元件

class

final routes = ) => searchpage(

arguments: arguments,

),};

@override

widget build(buildcontext context) else}},

);}}

(2)跳轉頁面配置

按鈕點選跳轉事件:

onpressed: () );

},

arguments這個關鍵字需要固定

(3)被跳轉頁面配置

① statelesswidget配置

class

searchpage extends statelesswidget );

@override

widget build(buildcontext context) "),

);}}

②statefulwidget配置

import 'package:flutter/material.dart';

class product extends

statefulwidget );

@override

_productstate createstate() => _productstate(arguments: this

.arguments);

}class _productstate extends state);

@override

widget build(buildcontext context) "),

),),

);}}

Flutter 替換路由 指定跳轉路由

替換路由 注意路由配置和上篇文章配置相同 import package flutter material.dart class minepage extends statefulwidget super key key minepagestate createstate minepagestate ...

Flutter學習三 命名路由

專案結構 所有的路由統一在routes.dart中管理 routes.dart 將所有需要跳轉的介面引入進來,ongenerateroute的寫法不變,可以直接複製使用,意思大概是獲取你要跳轉的頁面名,如果不為空檢查有沒有引數,如果產生書不為空執行 pagecontentbuilder contex...

路由使用 路由跳轉 路由傳參

修改src main.js檔案,載入路由 import router from router import store from store store.js 路由跳轉,有兩種方式。this.router.push this.router.push 在元件中可以使用this.rou ter訪 問路由...