En este artículo, exploraremos el proceso de eliminación de datos en Internet. Para hacerlo, debemos seguir 3 pasos cruciales:
- Importar el paquete http
- Eliminar los datos en el servidor
- Actualizar la pantalla después de la eliminación
Ahora, los exploraremos en detalle.
Importación del paquete http :
Para instalar el paquete http, use el siguiente comando en su símbolo del sistema:
pub get
o, si está utilizando flutter cmd, use el siguiente comando:
flutter pub get
Después de la instalación, agregue la dependencia al archivo pubsec.ym l como se muestra a continuación:
Ahora importe el paquete http en el archivo main.dart como se muestra a continuación:
import 'package:http/http.dart' as http;
Eliminación de datos en el servidor:
Ahora use el método http.delete() en JSONPlaceHolder para eliminar el álbum con id=1 como se muestra a continuación:
Dart
Future<Response> deleteAlbum(String id) async { final http.Response response = await http.delete( 'https://jsonplaceholder.typicode.com/albums/$id', headers: <String, String>{ 'Content-Type': 'application/json; charset=UTF-8', }, ); return response; }
Actualizar la pantalla:
Aquí crearemos un botón de eliminación de datos que puede verificar si se han eliminado datos del servidor llamando al método http.get() como se muestra a continuación:
Dart
Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Text('${snapshot.data?.title ?? 'Deleted'}'), RaisedButton( child: Text('Delete Data'), onPressed: () { setState(() { _futureAlbum = deleteAlbum(snapshot.data.id.toString()); }); }, ), ], );
Ahora, cuando hace clic en el botón Eliminar datos , se llama al método deleteAlbum() y la identificación que está pasando es la identificación de los datos que recuperó de Internet. Esto significa que va a eliminar los mismos datos que obtuvo de Internet.
Devolviendo una respuesta:
Después de que se eliminen los datos, necesitaremos enviar una respuesta de éxito o fracaso. Para hacerlo, mire la siguiente implementación de respuesta:
Dart
Future<Album> deleteAlbum(String id) async { final http.Response response = await http.delete( 'https://jsonplaceholder.typicode.com/albums/$id', headers: <String, String>{ 'Content-Type': 'application/json; charset=UTF-8', }, ); if (response.statusCode == 200) { return Album.fromJson(json.decode(response.body)); } else { throw Exception('Failed to delete album.'); } }
Código fuente completo:
Dart
import 'dart:async'; import 'dart:convert'; import 'package:flutter/material.dart'; import 'package:http/http.dart' as http; Future<Album> fetchAlbum() async { final response = await http.get('https://jsonplaceholder.typicode.com/albums/1'); if (response.statusCode == 200) { // A 200 OK response means // ready to parse the JSON. return Album.fromJson(json.decode(response.body)); } else { // If not a 200 ok response // means throw an exception. throw Exception('Failed to load album'); } } Future<Album> deleteAlbum(String id) async { final http.Response response = await http.delete( 'https://jsonplaceholder.typicode.com/albums/$id', headers: <String, String>{ 'Content-Type': 'application/json; charset=UTF-8', }, ); if (response.statusCode == 200) { return Album.fromJson(jsonDecode(response.body)); } else { throw Exception('Item Not Deleted!'); } } class Album { final int id; final String title; Album({this.id, this.title}); factory Album.fromJson(Map<String, dynamic> json) { return Album( id: json['id'], title: json['title'], ); } } void main() { runApp(MyApp()); } class MyApp extends StatefulWidget { MyApp({Key key}) : super(key: key); @override _MyAppState createState() { return _MyAppState(); } } class _MyAppState extends State<MyApp> { Future<Album> _futureAlbum; @override void initState() { super.initState(); _futureAlbum = fetchAlbum(); } @override Widget build(BuildContext context) { return MaterialApp( title: 'Data Deletion', theme: ThemeData( primarySwatch: Colors.blue, ), home: Scaffold( appBar: AppBar( title: Text('GeeksForGeeks'), backgroundColor: Colors.green, ), body: Center( child: FutureBuilder<Album>( future: _futureAlbum, builder: (context, snapshot) { if (snapshot.connectionState == ConnectionState.done) { if (snapshot.hasData) { return Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ Text('${snapshot.data?.title ?? 'Deleted'}'), RaisedButton( child: Text('Delete Data'), onPressed: () { setState(() { _futureAlbum = deleteAlbum(snapshot.data.id.toString()); }); }, ), ], ); } else if (snapshot.hasError) { return Text("${snapshot.error}"); } } return CircularProgressIndicator(); }, ), ), ), ); } }
Producción:
Publicación traducida automáticamente
Artículo escrito por ddeevviissaavviittaa y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA