Como aproveitar o Flutter Null Safety ao máximo
DissoWidget Build() {
if(state.user == null) {
return NoUserFoundWidget();
} else {
return Column(
children: [
Row(
children: [
USerProfileImage(imageUrl: state.user?profieImageUrl),
Gap(16),
Text(state.user?.name ?? "N/A")
]
},
Gap(16),
// Você tem que usar o ! operador
InfoRow(text: "Email: ${state.user!.email}"),
Gap(16),
// Ou o ? operador em todos os lugares
InfoRow(text: "Gender: ${state.user?.gender ?? 'N/A'}"),
Gap(16),
InfoRow(text: "Favorite color: ${state.usar?.favoriteColor ?? 'N/A'}"),
],
};
}
| Por issoWidget Build() {
final user = state.user;
if(user == null) {
return NoUserFoundWidget();
} else {
return Column(
children: [
Row(
children: [
UserProfileImage(imageUrl: user.profieImageUrl),
Gap(16),
Text(user.name)
]
},
Gap(16),
// Você tem que usar o ! operador
InfoRow(text: "Email: ${user.email}"),
Gap(16),
// Ou o ? operador em todos os lugares
InfoRow(text: "Gender: ${user.gender}"),
Gap(16),
InfoRow(text: "Favorite color: ${usar.favoriteColor}"),
],
};
}
|
Isso já aconteceu com você?
Você tem uma propriedade de classe anulável e faz uma verificação nula.
if(state.user != null) {
print(state.user?.name);
}Mas o código ainda acredita que a propriedade pode ser nula, então você deve usar “!” ou “?” operadores em todos os lugares.
Bem, há um pequeno truque que não apenas melhorará a limpeza e a legibilidade do seu código, mas também reduzirá possíveis erros no futuro.
Continue lendo se isso é algo que lhe interessa…
Se você atribuir a propriedade de classe a uma variável local e fizer uma verificação nula nela.
final user = state.user;
if(user != null) {
print(user.name);
}Você verá que o compilador não lançará um aviso ou um erro.
Mas… Por que isso?
Isso ocorre porque ele está realizando o que é chamado de “conversão automática” no Flutter. O compilador é inteligente o suficiente para entender que, se você verificar se uma variável não é nula, dentro do if a variável não pode ser nula. Então está transformando seu tipo original de User? ⇒ User dentro da instrução if.
Você também pode fazer isso fazendo uma verificação nula na parte superior dos métodos.
void myMethod() {
final user = state.user;
if(user == null) return;
print(user.name);
}Essa técnica também reduz a quantidade de “!” operadores em seu código que podem causar alguns NullExceptions se não forem tratados corretamente.
Pode parecer uma mudança muito pequena e inútil. Mas deixe-me dizer por experiência que esse pequeno truque elevará seu código para corresponder ao que os desenvolvedores mais experientes estão fazendo.
Talvez este exemplo não seja tão relevante.
Vamos verificar outro exemplo:
Widget build() {
if(state.user == null) {
return NoUserFoundWidget();
} else {
return Column(
children: [
Row(
children: [
UserProfileImage(imageUrl: state.user!.profileImageUrl),
Gap(16),
Text(state.user?.name ?? "N/A"),
]
),
Gap(16),
// Você tem que usar o ! operador
InfoRow(text: "Email: ${state.user!.email}"),
Gap(16),
// Ou o ? operador em todos os lugares
InfoRow(text: "Gender: ${state.user?.gender ?? 'N/A'}"),
Gap(16),
InfoRow(text: "Favorite color: ${state.user?.favoriteColor ?? 'N/A'}"),
],
);
}Aqui você tem que continuar adicionando o “!” ou “?” operadores em todos os lugares, o que às vezes é desnecessário, torna seu código mais longo e pode até gerar problemas no futuro.
Digamos que você precise mostrar o email do usuário em outra página. Em alguns casos, você ou um colega de equipe pode voltar a esse arquivo e copiar o widget InfoRow para outro arquivo. Mas eles podem ter esquecido de verificar se state.user não é nulo. E aí está…
NullPointerException
Portanto, acredite em mim, esta não é apenas uma maneira de tornar seu código mais bonito, mais limpo e de maior qualidade, mas também evita possíveis problemas devido ao uso excessivo de operadores com reconhecimento nulo.
Aqui está como o código ficaria se você usasse o truque simples que 1% dos principais desenvolvedores do Flutter estão usando.
Widget build() {
final user = state.user
if(user == null) {
return NoUserFoundWidget();
} else {
return Column(
children: [
Row(
children: [
UserProfileImage(imageUrl: user.profileImageUrl),
Gap(16),
Text(user.name),
]
),
Gap(16),
InfoRow(text: "Email: ${user.email}"),
Gap(16),
InfoRow(text: "Gender: ${user.gender}"),
Gap(16),
InfoRow(text: "Favorite color: ${user.favoriteColor}"),
],
);
}Como você pode ver menos “!” ou “?” operadores voando por aí, o que significa menos código para escrever. Apenas adicionando 1 linha de código.
Isso é algo que vejo muito poucas pessoas falando e que pode tornar sua base de código muito melhor.
Não deixe de conhecer meus Ebooks de Flutter/Dart
