Tokie skaitytojai kaip jūs padeda palaikyti MUO. Kai perkate naudodami nuorodas mūsų svetainėje, galime uždirbti filialų komisinius. Skaityti daugiau.

Socialinė žiniasklaida tapo neatsiejama mūsų kasdienio gyvenimo dalimi ir yra puiki platforma įmonėms susisiekti su savo klientais. Socialinio bendrinimo mygtukų pridėjimas prie programos „React“ gali padėti padidinti pasiekiamumą ir matomumą socialinės žiniasklaidos platformose. Šiame straipsnyje sužinosite, kaip galite lengvai pridėti socialinio bendrinimo mygtukus React programoje.

Socialinio bendrinimo mygtukų pridėjimas prie „React“ programos

Prieš pradėdami, turėsite turėti pagrindinį supratimą apie React ir kaip tai padaryti nustatyti React programėlę. Taip pat turėtumėte turėti paskyrą socialinės žiniasklaidos platformoje (-ose), prie kurios (-ių) norite pridėti bendrinimo mygtukus.

React-share modulio įdiegimas

Yra keletas parinkčių, kaip pridėti socialinio bendrinimo mygtukus prie programos „React“. Viena iš galimybių yra naudoti reaguoti-dalintis

instagram viewer
modulis, kuris yra lengva ir paprasta naudoti biblioteka, skirta pridėti socialinio bendrinimo mygtukus prie programos. Norėdami įdiegti reaguoti-dalintis modulyje, turite paleisti šią komandą:

npm diegti reaguoti -Dalintis

Mygtuko „Share to Facebook“ kūrimas

Kai tik turėsite reaguoti-dalintis įdiegtas modulis, galite pradėti pridėti socialinio bendrinimo mygtukus prie savo programos. Norėdami tai padaryti, turėsite importuoti reikiamus komponentus iš reaguoti-dalintis modulis. Pavyzdžiui, norėdami pridėti bendrinimo prie „Facebook“ mygtuką, turite naudoti šį kodą:

importuoti { FacebookShareButton } iš"reaguoti-dalintis";

Tada galite naudoti Facebook ShareButton savo kodo komponentą, kad pridėtumėte bendrinimo mygtuką „Facebook“ prie programos.

importuoti Reaguoti iš'reaguoti';
importuoti { FacebookShareButton, FacebookIcon } iš"reaguoti-dalintis";
konst Programa = () => {
grąžinti (
<div>
 url={' https://www.example.com'}
 citata={"Manekeno tekstas!"}
 hashtag="#muo"
 >
<„Facebook“ piktogramadydis={32}apvalus />
Facebook ShareButton>
div>
 );
};
eksportuotinumatytas Programėlė;

Žemiau yra išvestis, kurioje rodomas mygtukas bendrinti „Facebook“:

Šiame kode pirmiausia turite importuoti reikiamus komponentus iš reaguoti-dalintis modulis. Po to sukurkite funkcinį komponentą, vadinamą Programėlė kuriame yra „Facebook“ bendrinimo mygtukas. The Facebook ShareButton komponentas naudojamas bendrinimo mygtukui sukurti ir „Facebook“ piktograma komponentas naudojamas „Facebook“ logotipui rodyti ant mygtuko.

The Facebook ShareButtonkomponentas turi keletą rekvizitų kurį galima naudoti norint tinkinti bendrinimo mygtuką. Šiame pavyzdyje mes nurodėme url, citata, ir grotelėmis rekvizitai.

Galiausiai turite eksportuoti Programėlė komponentas, kad jį būtų galima naudoti kitose mūsų programos vietose. Spustelėjus mygtuką „Bendrinti su Facebook“, bus atidarytas iš anksto užpildytas bendrinimo dialogo langas su nurodytu url, citata, ir grotelėmis.

Be Facebook, reaguoti-dalintis modulyje taip pat pateikiami komponentai, skirti pridėti socialinio bendrinimo mygtukus kelioms kitoms platformoms, įskaitant „Instagram“, „Twitter“, „LinkedIn“ ir kt.

Norėdami pridėti socialinio bendrinimo mygtuką kitai platformai, turėsite importuoti reikiamus komponentus iš reaguoti-dalintis modulis. Pavyzdžiui, norėdami pridėti „Twitter“ bendrinimo mygtuką, pirmiausia turite importuoti:

importuoti { TwitterShareButton, TwitterIcon } iš"reaguoti-dalintis";

Tada galite naudoti „TwitterShare“ mygtukas ir „Twitter“ piktograma komponentus savo kode, kad pridėtumėte bendrinimo mygtuką „Twitter“ prie programos.

 url={' https://www.example.com'}
 citata={"Manekeno tekstas!"}
 hashtag="#muo"
>
<„Twitter“ piktogramadydis={32}apvalus />
„TwitterShare“ mygtukas>

Žemiau yra išvestis, rodanti bendrinimo „Facebook“ ir bendrinimo „Twitter“ mygtukus:

Kai spustelėsite „Twitter“ bendrinimo mygtuką, atsidarys iš anksto užpildytas bendrinimo dialogo langas su nurodytu URL ir citata.

Mygtukų pritaikymas

Socialinio bendrinimo mygtuko komponentai turi keletą rekvizitų, kuriuos galite naudoti norėdami tinkinti mygtuką. Kai kurie turimi rekvizitai apima:

  • url: URL, kuris bus bendrinamas „Facebook“.
  • citata: citata pasidalinti Facebook
  • grotelėmis: grotažymė, kurią reikia pridėti prie bendrinamo įrašo „Facebook“.

Visą galimų socialinio bendrinimo mygtukų ir rekvizitų sąrašą galite rasti reaguoti-dalintis oficialius dokumentus.

Gaukite daugiau puslapių peržiūrų naudodami socialinio bendrinimo mygtukus

Socialinio bendrinimo mygtukų pridėjimas prie programos „React“ gali padėti padidinti pasiekiamumą ir matomumą socialinės žiniasklaidos platformose. Suteikdami vartotojams galimybę lengvai bendrinti jūsų turinį, galite pasiekti didesnę auditoriją ir pritraukti daugiau srauto į programą. Be to, bendrinimo socialiniuose tinkluose mygtukai taip pat gali padėti padidinti jūsų prekės ženklo patikimumą ir autoritetą, nes bendrinimai gali būti jūsų programos rekomendacijos.