Obx不更新RangeSlider GetX

Question

声明超出Widget build作用域：

Rx<RangeValues> values = RangeValues(MIN_USD_AMOUNT, MAX_USD_AMOUNT).obs;
Rx<RangeLabels> labels = RangeLabels(MIN_USD_AMOUNT.toString(), MAX_USD_AMOUNT.toString()).obs;

这是在脚手架中的容器中：

Obx(() => RangeSlider(
                divisions: 5,
                activeColor: Colors.red[700],
                inactiveColor: Colors.red[300],
                max: MAX_USD_AMOUNT,
                min: MIN_USD_AMOUNT,
                values: values.value,
                labels: labels.value,
                onChanged: (value) {
                  print("START: ${value.start}, End: ${value.end}");
                  this.values = values;
                  this.labels = RangeLabels(
                          "${value.start.toInt().toString()} USD",
                          "${value.end.toInt().toString()} USD")
                      .obs;
                })),

我的问题:当我更改滑块的值时，我可以看到它在控制台中工作，但视图没有更新。滑块根本没有更新。

Answer 1

在常规RangeLabels中更新几个RxStrings可能会更容易一些。

  RxString startLabel = MIN_USD_AMOUNT.toString().obs;
  RxString endLabel = MAX_USD_AMOUNT.toString().obs;

在滑块的onChanged中，只需更新字符串。

  controller.startLabel.value = value.start.toString();
  controller.endLabel.value = value.end.toString();

假设您已经定义了GetX类的controller，则整个Obx将如下所示。

 Obx(
   () => RangeSlider(
     divisions: 5,
     activeColor: Colors.red[700],
     inactiveColor: Colors.red[300],
     min: MIN_USD_AMOUNT,
     max: MAX_USD_AMOUNT,
     values: controller.values.value,
     labels: RangeLabels(
     controller.startLabel.value, controller.endLabel.value),
     onChanged: (value) {
        controller.startLabel.value = value.start.toString();
        controller.endLabel.value = value.end.toString();
        controller.values.value = value;
                },
              ),
            ),

这将更新UI中的值。