Get路由傳值方法

跳轉路由First --> Second

1：第一種方法

Second頁面的的controller利用建構函式接收由First傳過來的值，在binding注入時接收First頁面傳過來的值。

///second_state
///定義要從First接收的變數，並在建構函式裡初始化
class SecondState {
  SecondState({required this.phoneNumber, required this.password});
  RxString phoneNumber = ''.obs;
  RxString password = ''.obs;
}
 

///second_controller
///利用建構函式初始化state，這樣binding就需要傳入state
class SecondController extends GetxController {
  SecondController({required this.state});
  SecondState state;
}

///second_binding
///在binding注入時接收從First頁面傳過來的state
class SecondBinding extends Bindings {
  @override
  void dependencies() {
    Get.lazyPut<SecondController>(
      () => SecondController(state: Get.arguments),
    );
  }
}
 

///first_state
///定義controller，獲取輸入框的text
class FirstState {
  TextEditingController phoneController = TextEditingController();
  TextEditingController passwordController = TextEditingController();
}

///first_controller
///把SecondState的phoneNumber和password變數賦值並傳過Second頁面
class FirstController extends GetxController {
  FirstState state = FirstState();
///跳轉方法
  void onSubmit() {
    Get.toNamed(Routes.SECOND,
        arguments: SecondState(
            phoneNumber: state.phoneController.text.obs,
            password: state.passwordController.text.obs));
  }
}
 

///second_view
///用Obx包裹，顯示從First頁面傳過來的值
Center(
    child: Obx(() => Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
            Text(
                '手機號碼：${controller.state.phoneNumber.value}\n 密碼：${controller.state.password.value}')
        ],
    )),
)

2：第二種方法

First頁面直接傳state到Second頁面，Second頁面接收First頁面傳過來的state，並賦值給Second頁面state的變數。

///first_state
///定義controller，獲取輸入框的text
class FirstState {
  TextEditingController phoneController = TextEditingController();
  TextEditingController passwordController = TextEditingController();
}

///first_controller
///直接把state傳給Second頁面
class FirstController extends GetxController {
  FirstState state = FirstState();
  void onSubmit() {
    Get.toNamed(Routes.SECOND, arguments: state);
  }
}

///second_state
///定義變數接收First頁面傳過來的值
class SecondState {
  RxString phoneNumber = ''.obs;
  RxString password = ''.obs;
}

///second_controller
///定義方法接收First傳來的值並賦值給state的變數
class SecondController extends GetxController {
    SecondState state = SecondState();
    
///定義方法接收傳來的值
    void fetchData() {
        final FirstState result = Get.arguments;
        state.phoneNumber.value = result.phoneController.text;
        state.password.value = result.passwordController.text;
    }
    
///在onReady裡初始化方法
    @override
    void onReady() {
        super.onReady();
        fetchData();
    }

}

///secondd_view
///用Obx包裹，顯示傳來的值
Center(
    child: Obx(() => Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
            Text(
                '手機號碼：${controller.state.phoneNumber.value}\n 密碼：${controller.state.password.value}')
        ],
    )),
)

返回路由Second --> First

直接把Second的state傳回去，First定義變數接收就行。

///second_controller
///定義返回到First頁面方法，把Second頁面的state返回
class SecondController extends GetxController {
  SecondState state = SecondState();
  void backFirst() {
    Get.back(result: state);
  }
}

///first_state
///定義兩個變數接收Second頁面返回的值
class FirstState {
  TextEditingController phoneController = TextEditingController();
  TextEditingController passwordController = TextEditingController();
    
  RxString phoneNumber = ''.obs;
  RxString password = ''.obs;
}

///first_controller
///First跳轉到Second頁面時，等待Second頁面返回的值，接收到值後賦值給自身的state裡的變數
class FirstController extends GetxController {
  FirstState state = FirstState();
  Future onSubmit() async {
    final SecondState result =
        await Get.toNamed(Routes.SECOND, arguments: state);
    state.phoneNumber.value = result.phoneNumber.value;
    state.password.value = result.password.value;
  }
}

///first_view
///顯示從Second頁面返回的值
Padding(
    padding: const EdgeInsets.all(8.0),
    child: Obx(() => Text(
        '從Second頁面返回的值\n手機號碼：${controller.state.phoneNumber.value}\n密碼：${controller.state.password.value}')),
),