Comment Importer Des Données CSV Et Excel Dans MySQL Dans Laravel 8

L'importation de données en bloc est une fonctionnalité utile pour ajouter des enregistrements stockés dans un fichier à la base de données. Les données peuvent être stockées au format – CSV, Excel, XML, ODS, etc.

Dans ce tutoriel, je montre comment vous pouvez importer des données CSV et Excel dans la base de données MySQL à l'aide du package Laravel Excel dans le projet Laravel 8.


1. Installer le package

Exigence -

  • PHP : ^7.2\|^8.0
  • Laravel : ^5.8
  • Feuille de calcul Php : ^1.21
  • psr/simple-cache : ^1.0
  • Extension PHP  php_zip activée
  • Extension PHP  php_xml activée
  • Extension PHP  php_gd2 activée
  • Extension PHP  php_iconv activée
  • Extension PHP  php_simplexml activée
  • Extension PHP  php_xmlreader activée
  • Extension PHP  php_zlib activée

Installez le package à l'aide de composer -

composer require maatwebsite/excel

Si vous obtenez une erreur lors de l'exécution de la commande ci-dessus, exécutez la commande ci-dessous -

composer require psr/simple-cache:^1.0 maatwebsite/excel

Après cela, exécutez à nouveau –

composer require maatwebsite/excel

2. Mettre à jour app.php

  • Ouvrir  config/app.php le fichier.
  • Ajoutez ce qui suit Maatwebsite\Excel\ExcelServiceProvider::class dans  'providers' -
'providers' => [
      ....
      ....
      ....  
      Maatwebsite\Excel\ExcelServiceProvider::class
];
  • Ajoutez ce qui suit  'Excel' => Maatwebsite\Excel\Facades\Excel::class dans  'aliases' -
'aliases' => [
     .... 
     .... 
     .... 
     'Excel' => Maatwebsite\Excel\Facades\Excel::class
];

3. Publier le package

Exécutez la commande -

php artisan vendor:publish --provider="Maatwebsite\Excel\ExcelServiceProvider" --tag=config

Cela créera un nouveau excel.phpfichier au format config/.


4. Configuration de la base de données

Ouvrir .envle fichier.

Spécifiez l'hôte, le nom de la base de données, le nom d'utilisateur et le mot de passe.

DB_CONNECTION=mysql
DB_HOST=127.0.0.1
DB_PORT=3306
DB_DATABASE=tutorial
DB_USERNAME=root
DB_PASSWORD=

5. Créer un tableau

  • Créez une nouvelle table Employeesà l'aide de la migration et ajoutez des enregistrements.
php artisan make:migration create_employees_table
  • Maintenant, accédez au database/migrations/dossier à partir de la racine du projet.
  • Trouvez un fichier PHP qui se termine par create_employees_tableet ouvrez-le.
  • Définissez la structure de la table dans la up()méthode.
public function up()
{
    Schema::create('employees', function (Blueprint $table) {
        $table->id();
        $table->string('username');
        $table->string('name');
        $table->string('email');
        $table->smallInteger('age');
        $table->timestamps();
    });
}
  • Exécutez la migration –
php artisan migrate
  • Le tableau a été créé.

6. Modèle

  • Créer un Employeesmodèle.
php artisan make:model Employees
  • Ouvrir  app/Models/Employees.php le fichier.
  • Spécifiez les attributs de modèle assignables en masse - nom d'utilisateur, nom, e-mail et âge à l'aide de la $fillablepropriété.

Code terminé

<?php

namespace App\Models;

use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;

class Employees extends Model
{
    use HasFactory;

    protected $fillable = [
       'username','name','email','age'
    ];
}

7. Créer une classe d'importation

Je crée 2 classes d'importation juste à titre d'exemple -

1. Classe EmployeesImport –

php artisan make:import EmployeesImport --model=Employees
  • Ouvrir  app/Imports/EmployeesImport.php le fichier.
  • La classe a 1 méthode -
    • model() - Lit les valeurs de $rowArray et insère un enregistrement si l'identifiant de messagerie n'existe pas dans la employeestable, sinon renvoie null.

REMARQUE - Cette classe d'importation commence à lire les enregistrements à partir de la 1ère ligne. J'ai expliqué comment ignorer la 1ère ligne qui contient l'en-tête dans la prochaine classe d'importation.

Fichier CSV sans ligne d'en-tête –

utilisateur1Utilisateur1 u1user1@makitweb.com28
utilisateur2Utilisateur2 u2user2@makitweb.com24

Code terminé

<?php
namespace App\Imports;

use App\Models\Employees;
use Maatwebsite\Excel\Concerns\ToModel;

class EmployeesImport implements ToModel {
    /**
    * @param array $row
    *
    * @return \Illuminate\Database\Eloquent\Model|null
    */
    public function model(array $row) {
 
       // Check email already exists
       $count = Employees::where('email',$row[2])->count();
       if($count > 0){
          return null;
       }
       return new Employees([
          'username' => $row[0],
          'name' => $row[1], 
          'email' => $row[2],
          'age' => $row[3],
       ]);
    }

}

2. Classe Employees2Import -

php artisan make:import Employees2Import --model=Employees
  • Ouvrir  app/Imports/Employees2Import.php le fichier.
  • La classe a 2 méthodes -
    • collection() – Valide $rowsles données du tableau. Si la validation est réussie, insérez un enregistrement si l'identifiant de messagerie n'existe pas dans la employeestable, sinon renvoyez une erreur.

NOTE – Si  WithHeadingRowest implémenté, alors $rowsArrays contient l'en-tête de ligne comme noms de clé au lieu d'index.

  • headerRow() – Renvoie la position de l'index d'en-tête.

Fichier CSV avec ligne d'en-tête –

Nom d'utilisateurNomE-mailÂge
yssyogeshYogesh singhyogesh@makitweb.com28
bsonarikaSonarika Bhadoriabsonarika@makitweb.com28
vishalVishal Sahuvishal@makitweb.comtrente et un

Code terminé

<?php

namespace App\Imports;

use App\Models\Employees;
use Illuminate\Support\Collection;
use Maatwebsite\Excel\Concerns\ToCollection;
use Maatwebsite\Excel\Concerns\WithHeadingRow;
use Illuminate\Support\Facades\Validator;

class Employees2Import implements ToCollection ,WithHeadingRow
{

    public function collection(Collection $rows){

       // Validate
       Validator::make($rows->toArray(), [
          '*.username' => 'required|string',
          '*.name' => 'required|string',
          '*.email' => 'required|email',
          '*.age' => 'required|integer',
       ],[
          '*.username.required'=> "The username field is required.",
          '*.username.string'=> "The username must be string.",
          '*.name.required'=> "The name field is required.",
          '*.name.string'=> "The name must be string.",
          '*.email.required'=> "The email field is required.",
          '*.email.email'=> "The email must be a valid email address.",
          '*.age.integer'=> "The age must be an integer."
       ])->validate();

       foreach ($rows as $row) {

          // Check email already exists
          $count = Employees::where('email',$row['email'])->count();
          if($count > 0){
             continue;
          }
          Employees::create([
             'username' => $row['username'],
             'name' => $row['name'], 
             'email' => $row['email'],
             'age' => $row['age'],
         ]);
       }
    }

    // Specify header row index position to skip
    public function headingRow(): int {
       return 1;
    }
}

8. Itinéraire

  • Ouvrir  routes/web.php le fichier.
  • Définir 3 itinéraires –
    • / –  Charger la vue d'index.
    • employés/importdata – Publier la route vers les données d'importation.
    • employee/validateandimportdata – Route de publication pour valider et importer des données.

Code terminé

<?php

use Illuminate\Support\Facades\Route;
use App\Http\Controllers\EmployeesController;

Route::get('/', [EmployeesController::class, 'index'])->name('home'); 
Route::post('employees/importdata/', [EmployeesController::class, 'importData'])->name('employees.importdata');
Route::post('employees/validateandimportdata/', [EmployeesController::class, 'validateAndImportdata'])->name('employees.validateandimportdata');

9. Contrôleur

  • Créer  EmployeesController un contrôleur.
php artisan make:controller EmployeesController
  • Ouvrir  app/Http/Controllers/EmployeesController.php le fichier.
  • Importer   et  . EmployeesImportEmployees2ImportExcel
  • Créez 3 méthodes –
    • index() – Charger la indexvue.
    • importdata() – Pour importer, appelez Excel::import().

Passer 2 paramètres –

  1. EmployeesImportInstance de classe.
  2. Passer l'emplacement 'temp' du fichier sélectionné.
    • validateAndImportdata() – Appelez à nouveau Excel::import().

Passer 2 paramètres –

  1. Employees2ImportInstance de classe.
  2. Passez l'emplacement du fichier stocké (j'ai stocké le fichier dans public/employees.xlsxle dossier).

Code terminé

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Imports\EmployeesImport;
use App\Imports\Employees2Import;
use Excel;

class EmployeesController extends Controller
{
   public function index(){
      return view('index');
   }

   // Import data 
   public function importdata(Request $request){
      Excel::import(new EmployeesImport, $request->file('file')->store('temp'));
      return back()->with('success', 'Import successfully!');
   }

   // Validate and Import data 
   public function validateAndImportdata(Request $request){

      Excel::import(new Employees2Import, "employees.xlsx");
      return back()->with('success', 'Import successfully!');
   }

}

10. Voir

Créer  index.blade.php un fichier dans  resources/views/ le dossier.

Créer 2 <form>

  • Dans la 1ère <form >action définie sur {{ route('employees.importdata') }}. Créez un élément de fichier et un bouton d'envoi.
  • Dans la 2ème <form>action définie sur {{ route('employees.validateandimportdata') }}. Créez un bouton de soumission.

Boucle sur $errors->all()pour afficher les erreurs.

Code terminé

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <title>How to Import data into MySQL database in Laravel 8</title>

   <!-- CSS -->
   <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0-beta1/dist/css/bootstrap.min.css" rel="stylesheet" >
</head>
<body>

   <div class="container mt-5">

      <!-- Success message -->
      @if(Session::has('success'))
         <div class="alert alert-success">
            {{ Session::get('success') }}
         </div>
      @endif

      <form method='post' action="{{ route('employees.importdata') }}" enctype="multipart/form-data">
         @csrf
         <div class="mb-3">
            <label for="file" class="form-label">File</label>
            <input type="file" class="form-control" id="file" name="file" value="">
         </div>

         <button type="submit" class="btn btn-success">Import</button>
      </form>

      <!-- Import data with validation -->
      <h2 class='mt-5'>Validate and import data</h2>
      {{-- Display errors --}}
      @if (count($errors) > 0)
         <div class="row">
            <div class="col-md-12 ">
                <div class="alert alert-danger">
                   <ul>
                      @foreach($errors->all() as $error)
                         <li>{{ $error }} </li>
                      @endforeach 
                   </ul> 
                </div>
            </div>
         </div>
      @endif

      <form method='post' action="{{ route('employees.validateandimportdata') }}" >
         @csrf
         <button type="submit" class="btn btn-success">Import</button>
      </form>
   </div>

</body>
</html>

11. Sortie

Afficher la sortie


12.Conclusion

Assurez-vous de valider l'enregistrement avant d'insérer ou de mettre à jour des enregistrements dans la classe d'importation. Spécifiez WithHeadingRowdans Classe d'importation uniquement si le fichier d'importation comporte une ligne d'en-tête.

Source: https://makitweb.com

#laravel #php #mysql 

What is GEEK

Buddha Community

Comment Importer Des Données CSV Et Excel Dans MySQL Dans Laravel 8

Laravel 8 Import Export CSV/EXCEL File Example

In this post i will show you Laravel 8 Import Export CSV/EXCEL File Example. We will simple create import data to xls, csv file and also we will import data to database using csv file in laravel 8 application.

Using this example we can easily import-export and download the csv & excel file from the database using the maatwebsite/excel composer package. maatwebsite/excel provide easy way to import and export csv file in laravel 8 using database model.

Laravel 8 Import Export CSV/EXCEL File Example

https://websolutionstuff.com/post/laravel-8-import-export-csv-excel-file-example

#laravel 8 import export csv/excel file example #laravel 8 #import #export #csv/excel #import and export csv file in laravel 8

Léon  Peltier

Léon Peltier

1656979200

Comment Exporter Une Fonction De C++ Vers React Native

Aujourd'hui, je continue à partager mon expérience avec le module natif et C++.

Comme nous verrons beaucoup de bibliothèques C/C++ écrire pour les plates-formes mobiles, nous devons les implémenter dans notre application iOS ou React Native. C'est pourquoi je souhaite écrire un article sur la façon d'exporter une fonction de C++ vers React Native, ce qui est facile à comprendre et fait gagner du temps aux débutants. Je vais commencer avec une nouvelle application native réactive

1. Créez une nouvelle application native React, ouvrez votre terminal et exécutez

npx react-native init NativeModules

2. Ouvrez Xcode et accédez à NativeModules/ios/NativeModule.xcworkspace

3. Travailler du côté C++

Créez un nouveau fichier C++ et nommez-leCpp_to_RN.cpp

Lorsque nous créons un nouveau fichier C++, Xcode créera un fichier d'en-tête Cpp_to_RN.hpp pour nous

Tout d'abord, ouvrez le fichier " Cpp_to_RN.hpp" et créez une classe qui inclut une fonction sans le corps.

#ifndef Cpp_to_RN_hpp
#define Cpp_to_RN_hpp#include <stdio.h>
#include <string>class Cpp_to_RN {
public:
    std::string sayHello();
};#endif /* Cpp_to_RN_hpp */

Ouvrez ensuite le Cpp_to_RN.cppfichier et écrivez une fonction simple " sayHello()"

#include "Cpp_to_RN.hpp"
std::string Cpp_to_RN::sayHello(){
    return "Hello from CPP";
}

4. Travail sur l'encapsulation du fichier C++.

Pour envelopper les fichiers C++ et les exporter vers le côté IOS (swift)

un. Créez un fichier Objective C et nommez-leCpp_to_RN.m

Renommez le Cpp_to_RN.m en Cpp_to_RN.mm

b. Ouvrez le WrapCpp_to_RN.mm fichier et écrivez le contenu du corps qui encapsulera la fonction sayHelloà partir du fichier C++.

#import <Foundation/Foundation.h>
#import "WrapCpp_to_RN.h"
#import "Cpp_to_RN.hpp"@implementation WrapCpp_to_RN- (NSString *) sayHello {
  Cpp_to_RN fromCPP;
    std::string helloWorldMessage = fromCPP.sayHello();
    return [NSString
            stringWithCString:helloWorldMessage.c_str()
            encoding:NSUTF8StringEncoding];
}
@end

c. Créez un fichier d'en-tête et nommez-leWrapCpp_to_RN.h

Exporter la wrapSayHellofonction vers le fichier Swift

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

5. Travailler du côté iOS (Swift)

Pour exporter la fonction C++ vers React Native

un. Créez un fichier Swift et nommez-leSendCpp_to_RN.swift

Remarque : Xcode nous demandera de créer un NativeModules-Bridging-Header.hfichier pour nous.

Créez une classe SendCpp_to_RNet déclarez-la commeNSObject

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

Écrire une fonction requiresMainQueueSetup()pour empêcher l'avertissement lorsque nous exécutons l'application

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

Ecrire une fonction pour envelopper le WrapCpp_to_RN()fromWrapCpp_to_RN.mm

import Foundation@objc(SendCpp_to_RN)
class SendCpp_to_RN : NSObject {
    
  @objc static func requiresMainQueueSetup() -> Bool {
        return false
    }
  
  @objc func fromCpp(_ successCallback: RCTResponseSenderBlock) -> Void {
    successCallback([NSNull(), WrapCpp_to_RN().wrapSayHello() as Any])
    }}

b. Exporter une fonction wrap dans un fichier Swift vers React Native

Créez un fichier Objective C pour exporter la classe Swift et sa fonction à l'aide deCallback

#import <React/RCTBridgeModule.h>
#import <Foundation/Foundation.h>
#import "UIKit/UIKit.h"
@interface RCT_EXTERN_MODULE(SendCpp_to_RN, NSObject)RCT_EXTERN_METHOD(fromCpp:(RCTResponseSenderBlock)successCallback)@end

c. Connectez Swift à React Native, ouvrez le NativeModules-Bridging-Header.h fichier

#import <React/RCTBridgeModule.h>#import <React/RCTViewManager.h>#import "WrapCpp_to_RN.h"

6. Travailler du côté React Native

Appelez la classe Swift et ses fonctions

import React from 'react';
import {StyleSheet, Text, View, NativeModules, Button} from 'react-native';const App = () => {
  const onPress = () => {
    const {SendCpp_to_RN} = NativeModules;
    SendCpp_to_RN.fromCpp((_err, res) => console.log(res));
  };
  return (
    <View style={styles.container}>
      <Text> Practice !</Text>
      <Button title="C++ to React Native" color="#841584" onPress={onPress} />
    </View>
  );
};
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});
export default App;

Et nous avons terminé, il suffit de lancer l'application

react-native run-ios

Ou cliquez simplement sur le bouton "exécuter" sur Xcode et voyez ce que nous avons fait.

J'espère que mon article vous sera utile, merci pour le temps de lecture.

 Source : https://betterprogramming.pub/native-modules-export-c-function-to-react-native-for-beginners-77e89934b210

#cpp #cplusplus #react 

Hoang  Ha

Hoang Ha

1656981000

Cách Xuất Một Hàm Từ C ++ Sang React Native

Hôm nay, tôi tiếp tục chia sẻ kinh nghiệm của mình với Native Module và C ++.

Vì chúng ta sẽ thấy rất nhiều thư viện C / C ++ viết cho nền tảng di động, chúng ta cần triển khai chúng cho ứng dụng iOS hoặc React Native của mình. Đó là lý do mình muốn viết một bài hướng dẫn cách export một hàm từ C ++ sang React Native dễ hiểu và tiết kiệm thời gian cho người mới bắt đầu. Tôi sẽ bắt đầu với một ứng dụng gốc phản ứng mới

1. Tạo một ứng dụng gốc phản ứng mới, mở thiết bị đầu cuối của bạn và chạy

npx react-native init NativeModules

2. Mở Xcode và điều hướng đến NativeModules / ios / NativeModule.xcworkspace

3. Làm việc trên C ++

Tạo một tệp C ++ mới và đặt tên cho nóCpp_to_RN.cpp

Khi chúng tôi tạo tệp C ++ mới, Xcode sẽ tạo tệp tiêu đề Cpp_to_RN.hpp cho chúng tôi

Đầu tiên, mở tệp Cpp_to_RN.hpp“” và tạo một lớp bao gồm một hàm không có phần thân.

#ifndef Cpp_to_RN_hpp
#define Cpp_to_RN_hpp#include <stdio.h>
#include <string>class Cpp_to_RN {
public:
    std::string sayHello();
};#endif /* Cpp_to_RN_hpp */

Sau đó, mở Cpp_to_RN.cpptệp và viết một hàm đơn giản “ sayHello()

#include "Cpp_to_RN.hpp"
std::string Cpp_to_RN::sayHello(){
    return "Hello from CPP";
}

4. Thao tác trên Wrapping C ++ file.

Để bọc các tệp C ++ và xuất chúng sang phía IOS (nhanh chóng)

một. Tạo một tệp Objective C và đặt tên cho nóCpp_to_RN.m

Đổi tên Cpp_to_RN.m thành Cpp_to_RN.mm

b. Mở WrapCpp_to_RN.mm tệp và viết nội dung phần nội dung sẽ bọc hàm sayHellotừ tệp C ++.

#import <Foundation/Foundation.h>
#import "WrapCpp_to_RN.h"
#import "Cpp_to_RN.hpp"@implementation WrapCpp_to_RN- (NSString *) sayHello {
  Cpp_to_RN fromCPP;
    std::string helloWorldMessage = fromCPP.sayHello();
    return [NSString
            stringWithCString:helloWorldMessage.c_str()
            encoding:NSUTF8StringEncoding];
}
@end

c. Tạo một tệp tiêu đề và đặt tên cho nóWrapCpp_to_RN.h

Xuất wrapSayHellohàm sang tệp Swift

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

5. Làm việc trên iOS (Swift)

Để xuất hàm C ++ sang React Native

một. Tạo một tệp Swift và đặt tên cho nóSendCpp_to_RN.swift

Lưu ý: Xcode sẽ yêu cầu chúng tôi tạo một NativeModules-Bridging-Header.htệp cho chúng tôi.

Tạo một lớp SendCpp_to_RNvà khai báo nó làNSObject

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

Viết một hàm requiresMainQueueSetup()để ngăn cảnh báo khi chúng tôi chạy ứng dụng

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

Viết một hàm để bọc WrapCpp_to_RN()từWrapCpp_to_RN.mm

import Foundation@objc(SendCpp_to_RN)
class SendCpp_to_RN : NSObject {
    
  @objc static func requiresMainQueueSetup() -> Bool {
        return false
    }
  
  @objc func fromCpp(_ successCallback: RCTResponseSenderBlock) -> Void {
    successCallback([NSNull(), WrapCpp_to_RN().wrapSayHello() as Any])
    }}

b. Xuất một hàm bọc trong tệp Swift sang React Native

Tạo một tệp Objective C để xuất lớp Swift và chức năng của nó bằng cách sử dụngCallback

#import <React/RCTBridgeModule.h>
#import <Foundation/Foundation.h>
#import "UIKit/UIKit.h"
@interface RCT_EXTERN_MODULE(SendCpp_to_RN, NSObject)RCT_EXTERN_METHOD(fromCpp:(RCTResponseSenderBlock)successCallback)@end

c. Kết nối Swift với React Native, mở NativeModules-Bridging-Header.h tệp

#import <React/RCTBridgeModule.h>#import <React/RCTViewManager.h>#import "WrapCpp_to_RN.h"

6. Làm việc ở phía React Native

Gọi lớp Swift và các chức năng của nó

import React from 'react';
import {StyleSheet, Text, View, NativeModules, Button} from 'react-native';const App = () => {
  const onPress = () => {
    const {SendCpp_to_RN} = NativeModules;
    SendCpp_to_RN.fromCpp((_err, res) => console.log(res));
  };
  return (
    <View style={styles.container}>
      <Text> Practice !</Text>
      <Button title="C++ to React Native" color="#841584" onPress={onPress} />
    </View>
  );
};
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});
export default App;

Và chúng tôi đã hoàn tất, chỉ cần chạy ứng dụng

react-native run-ios

Hoặc chỉ cần nhấp vào nút “chạy” trên Xcode và xem những gì chúng tôi đã làm.

Tôi hy vọng bài viết của tôi hữu ích cho bạn, cảm ơn bạn đã dành thời gian đọc.

 Nguồn: https://betterprogramming.pub/native-modules-export-c- Chức năng-to-react-native-for-beginners-77e89934b210

#cpp #cplusplus #react 

Como Exportar Uma Função De C++ Para React Native

Hoje, continuo compartilhando minha experiência com o Módulo Nativo e C++.

Como veremos muitas bibliotecas C/C++ escrevendo para plataformas móveis, precisamos implementá-las em nosso aplicativo iOS ou React Native. É por isso que quero escrever um artigo sobre como exportar uma função de C++ para React Native, que é fácil de entender e economiza tempo para iniciantes. Vou começar com um novo aplicativo nativo de reação

1. Crie um novo aplicativo nativo de reação, abra seu terminal e execute

npx react-native init NativeModules

2. Abra o Xcode e navegue até NativeModules/ios/NativeModule.xcworkspace

3. Trabalhando no lado C++

Crie um novo arquivo C++ e nomeie-oCpp_to_RN.cpp

Quando criamos um novo arquivo C++, o Xcode criará um arquivo de cabeçalho Cpp_to_RN.hpp para nós

Primeiro, abra o arquivo “ Cpp_to_RN.hpp e crie uma classe que inclua uma função sem o corpo.

#ifndef Cpp_to_RN_hpp
#define Cpp_to_RN_hpp#include <stdio.h>
#include <string>class Cpp_to_RN {
public:
    std::string sayHello();
};#endif /* Cpp_to_RN_hpp */

Em seguida, abra o Cpp_to_RN.cpparquivo e escreva uma função simples “ sayHello()

#include "Cpp_to_RN.hpp"
std::string Cpp_to_RN::sayHello(){
    return "Hello from CPP";
}

4. Trabalhando no arquivo C++ de encapsulamento.

Para encapsular os arquivos C++ e exportá-los para o lado IOS (swift)

uma. Crie um arquivo Objective C e nomeie-oCpp_to_RN.m

Renomeie o Cpp_to_RN.m para Cpp_to_RN.mm

b. Abra o WrapCpp_to_RN.mm arquivo e escreva o conteúdo do corpo que envolverá a função sayHellodo arquivo C++.

#import <Foundation/Foundation.h>
#import "WrapCpp_to_RN.h"
#import "Cpp_to_RN.hpp"@implementation WrapCpp_to_RN- (NSString *) sayHello {
  Cpp_to_RN fromCPP;
    std::string helloWorldMessage = fromCPP.sayHello();
    return [NSString
            stringWithCString:helloWorldMessage.c_str()
            encoding:NSUTF8StringEncoding];
}
@end

c. Crie um arquivo de cabeçalho e nomeie-oWrapCpp_to_RN.h

Exporte a wrapSayHellofunção para o arquivo Swift

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

5. Trabalhando no lado iOS (Swift)

Para exportar a função C++ para React Native

uma. Crie um arquivo Swift e nomeie-oSendCpp_to_RN.swift

Observação: o Xcode nos pedirá para criar um NativeModules-Bridging-Header.harquivo para nós.

Crie uma classe SendCpp_to_RNe declare-a comoNSObject

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

Escreva uma função requiresMainQueueSetup()para evitar avisos quando executamos o aplicativo

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

Escreva uma função para envolver o WrapCpp_to_RN()fromWrapCpp_to_RN.mm

import Foundation@objc(SendCpp_to_RN)
class SendCpp_to_RN : NSObject {
    
  @objc static func requiresMainQueueSetup() -> Bool {
        return false
    }
  
  @objc func fromCpp(_ successCallback: RCTResponseSenderBlock) -> Void {
    successCallback([NSNull(), WrapCpp_to_RN().wrapSayHello() as Any])
    }}

b. Exporte uma função wrap no arquivo Swift para React Native

Crie um arquivo Objective C para exportar a classe Swift e sua função usandoCallback

#import <React/RCTBridgeModule.h>
#import <Foundation/Foundation.h>
#import "UIKit/UIKit.h"
@interface RCT_EXTERN_MODULE(SendCpp_to_RN, NSObject)RCT_EXTERN_METHOD(fromCpp:(RCTResponseSenderBlock)successCallback)@end

c. Conecte o Swift ao React Native, abra o NativeModules-Bridging-Header.h arquivo

#import <React/RCTBridgeModule.h>#import <React/RCTViewManager.h>#import "WrapCpp_to_RN.h"

6. Trabalhando no lado React Native

Chame a classe Swift e suas funções

import React from 'react';
import {StyleSheet, Text, View, NativeModules, Button} from 'react-native';const App = () => {
  const onPress = () => {
    const {SendCpp_to_RN} = NativeModules;
    SendCpp_to_RN.fromCpp((_err, res) => console.log(res));
  };
  return (
    <View style={styles.container}>
      <Text> Practice !</Text>
      <Button title="C++ to React Native" color="#841584" onPress={onPress} />
    </View>
  );
};
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});
export default App;

E pronto, basta executar o aplicativo

react-native run-ios

Ou apenas clique no botão “executar” no Xcode e veja o que fizemos.

Espero que meu artigo seja útil para você, obrigado pelo tempo de leitura.

 Fonte: https://betterprogramming.pub/native-modules-export-c-function-to-react-native-for-beginners-77e89934b210

#cpp #cplusplus #react 

黎 飞

黎 飞

1656984600

如何将函数从 C++ 导出到 React Native

今天,我继续分享我在 Native Module 和 C++ 方面的经验。

由于我们将看到很多为移动平台编写的 C/C++ 库,因此我们需要将它们实现到我们的 iOS 或 React Native 应用程序中。这就是为什么我想写一篇关于如何将一个函数从 C++ 导出到 React Native 的文章,它易于理解并且为初学者节省了时间。我将从一个新的 react native 应用程序开始

1.新建一个react native app,打开你的终端运行

npx react-native init NativeModules

2. 打开 Xcode 并导航到 NativeModules/ios/NativeModule.xcworkspace

3. 在 C++ 端工作

创建一个新的 C++ 文件并命名Cpp_to_RN.cpp

当我们创建一个新的 C++ 文件时,Xcode 会Cpp_to_RN.hpp 为我们创建一个头文件

首先,打开“ Cpp_to_RN.hpp文件,并创建一个包含没有主体的函数的类。

#ifndef Cpp_to_RN_hpp
#define Cpp_to_RN_hpp#include <stdio.h>
#include <string>class Cpp_to_RN {
public:
    std::string sayHello();
};#endif /* Cpp_to_RN_hpp */

然后打开Cpp_to_RN.cpp文件,写一个简单的函数“ sayHello()

#include "Cpp_to_RN.hpp"
std::string Cpp_to_RN::sayHello(){
    return "Hello from CPP";
}

4. 处理包装 C++ 文件。

包装 C++ 文件并将它们导出到 IOS (swift) 端

一个。创建一个Objective C文件并命名Cpp_to_RN.m

重命名Cpp_to_RN.m Cpp_to_RN.mm

湾。打开WrapCpp_to_RN.mm 文件并编写将包装sayHelloC++ 文件中的函数的正文内容。

#import <Foundation/Foundation.h>
#import "WrapCpp_to_RN.h"
#import "Cpp_to_RN.hpp"@implementation WrapCpp_to_RN- (NSString *) sayHello {
  Cpp_to_RN fromCPP;
    std::string helloWorldMessage = fromCPP.sayHello();
    return [NSString
            stringWithCString:helloWorldMessage.c_str()
            encoding:NSUTF8StringEncoding];
}
@end

C。创建头文件并命名WrapCpp_to_RN.h

将函数导出wrapSayHello到 Swift 文件

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

5. 在 iOS (Swift) 端工作

将 C++ 函数导出到 React Native

一个。创建一个 Swift 文件并命名SendCpp_to_RN.swift

注意:Xcode 会要求我们为我们创建一个NativeModules-Bridging-Header.h文件。

创建一个类SendCpp_to_RN并将其声明为NSObject

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

编写一个函数requiresMainQueueSetup()来防止我们运行应用程序时出现警告

#import <Foundation/Foundation.h>
@interface WrapCpp_to_RN : NSObject
- (NSString *) wrapSayHello;
@end

编写一个函数来包装WrapCpp_to_RN()fromWrapCpp_to_RN.mm

import Foundation@objc(SendCpp_to_RN)
class SendCpp_to_RN : NSObject {
    
  @objc static func requiresMainQueueSetup() -> Bool {
        return false
    }
  
  @objc func fromCpp(_ successCallback: RCTResponseSenderBlock) -> Void {
    successCallback([NSNull(), WrapCpp_to_RN().wrapSayHello() as Any])
    }}

湾。将 Swift 文件中的包装函数导出到 React Native

创建一个 Objective C 文件以导出 Swift 类及其函数,使用Callback

#import <React/RCTBridgeModule.h>
#import <Foundation/Foundation.h>
#import "UIKit/UIKit.h"
@interface RCT_EXTERN_MODULE(SendCpp_to_RN, NSObject)RCT_EXTERN_METHOD(fromCpp:(RCTResponseSenderBlock)successCallback)@end

C。将 Swift 连接到 React Native,打开NativeModules-Bridging-Header.h 文件

#import <React/RCTBridgeModule.h>#import <React/RCTViewManager.h>#import "WrapCpp_to_RN.h"

6. 在 React Native 方面工作

调用 Swift 类及其函数

import React from 'react';
import {StyleSheet, Text, View, NativeModules, Button} from 'react-native';const App = () => {
  const onPress = () => {
    const {SendCpp_to_RN} = NativeModules;
    SendCpp_to_RN.fromCpp((_err, res) => console.log(res));
  };
  return (
    <View style={styles.container}>
      <Text> Practice !</Text>
      <Button title="C++ to React Native" color="#841584" onPress={onPress} />
    </View>
  );
};
const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
  },
});
export default App;

我们完成了,只需运行应用程序

react-native run-ios

或者只需单击 Xcode 上的“运行”按钮,看看我们做了什么。

希望我的文章对您有所帮助,感谢您的阅读时间。

 来源:https ://betterprogramming.pub/native-modules-export-c-function-to-react-native-for-beginners-77e89934b210

#cpp #cplusplus #react