#flutter #if-statement
#flutter #if-statement
Вопрос:
Я работал с flutter почти год, и, поскольку он не был готов к веб-разработке, мне нужно было переключиться на react.
Для условного отображения объекта внутри моего метода сборки мне пришлось поместить оператор if-else, отображающий мой пользовательский виджет, если условие было выполнено, или случайный пустой контейнер в другом случае.
@override
Widget build(BuildContext context) {
return Container(
child: condition == true
? new MyCustomWidget()
: new Container() //Random empty container to fill the else statement
)
)
Даже если это не вызывает никаких проблем с рендерингом, это все равно может быть неоднозначным для того, кто читает код. После работы с react я увидел, что он предоставляет способ отображения только блока if с использованием следующих обозначений:
<div>
{condition == true amp;amp; <MyCustomReactComponent/>} //this block is displayed only if the condition is met
</div>
Я предполагал, есть ли у flutter способ сделать что-то подобное.
Ответ №1:
Я использую Column
в подобных ситуациях, вы можете объявить несколько условий в зависимости от того, какой виджет вы хотите отобразить для какого условия.
Column(
children: <Widget>[
if(your condition) CustomWidgetOne(),
if(your condition) CustomWidgetTwo(),
if(your condition) CustomWidgetThree(),
],
),
Комментарии:
1. Пока это лучший ярлык для того, что я имел в виду. Спасибо
Ответ №2:
Это зависит от того, какое условие вы хотите отобразить конкретный виджет.
Например, если вы хотите отображать виджет боковой панели только на широких веб-страницах, вы можете использовать LayoutBuilder
виджет, который вы можете использовать как @media в vanilla web.
В противном случае вам нужно будет использовать тернарный оператор, как вы это делали.
Если вы хотите получить более полный ответ, вы можете проверить выступление Мариано Зорриллы на эту тему 28/01/21
Комментарии:
1. Хорошо, спасибо. Нет, это не тот случай, который мне нужен. Я оставил flutter для его системы маршрутизации. Я знал о различных сборщиках. Однако целью моего вопроса было понять, был ли у fluter (или был введен совсем недавно) альтернативный способ троичного оператора. При небольших условиях это не является большой проблемой, но когда размер страницы начинает увеличиваться, эта логика может стать нелогичной и сделать код беспорядочным.
2. На данный момент, насколько я знаю, альтернативы нет. Когда дело доходит до больших страниц / экранов, вам просто нужно использовать архитектуру и разделить экран на несколько маленьких виджетов.
3. Когда выражение, которое вы передаете троичному оператору, становится большим, пришло время провести рефакторинг! Троичный никогда не должен быть намного длиннее, чем
someCondition ? Widget1() : Widget2()
4. Я согласен с вами, Рэндал, но иногда создание другого пользовательского виджета просто для того, чтобы обернуть другой виджет внутри padding или что-то подобное, также может стать анти-шаблоном. Это будет похоже на создание пользовательской функции sum(a, b) просто для выполнения a b. Я знаю, что должен быть баланс между двумя вариантами, но я не думаю, что встроенное условие всегда является лучшим выбором
Ответ №3:
Вы всегда можете вернуть null , как если бы вы вообще не передавали дочерних элементов.
Комментарии:
1. Добавление null — это никогда не бывает безопасным решением. Даже если значение null никогда не должно выполняться, это может вызвать проблемы позже, когда код будет изменен
2. Лучше вернуть пустой контейнер() или пустой размерный ящик().
3. Я не согласен. Использование null в этом контексте imo не так уж плохо. Я также лично не являюсь поклонником возврата пустых контейнеров, поскольку вы все равно что-то возвращаете, в то время как на самом деле ничего не хотите возвращать.