Ipinapakilala ang Lightning Studio Extension
Ginagawa ng Lightning Studio ang Salesforce LWC na pag-develop nang madali at pinakamabilis. Sa loob ng editor na ito, maaari naming direktang gawin ang mga Apex/message channel at LWC script. Gayundin, maaari naming direktang i-deploy ang LWC (custom) na mga bahagi nang sabay-sabay. Tingnan natin kung paano idagdag ito sa aming website at buksan ito.
Pumunta sa website at hanapin ang “Lightning Studio – Magdagdag ng Chrome” (kung gumagamit ka ng Chrome). Mag-click sa button na “Idagdag sa Chrome”.
Makikita natin na idinagdag ito sa Chrome. Ngayon, ito ay hindi pinagana. Ito ay paganahin lamang kung ang Salesforce Org ay binuksan.
Ito ay pinagana pagkatapos mag-log in sa Salesforce Org.
Mag-click sa extension.
Pumunta sa kaliwa at piliin ang pangatlong icon na ginagamit upang lumikha ng bagong bahagi ng LWC.
- Una, kailangan nating tukuyin ang pangalan ng bahagi.
- Ginagamit ang 'isExposed' para itakda ang visibility ng component sa Salesforce. Dapat itong itakda sa totoo.
- Mahalagang tukuyin ang target kung saan ilalagay ang bahagi. Maaaring pumili ng maramihang mga target.
- Ang pag-deploy ng bahagi ay ang huling hakbang (i-click ang 'I-deploy').
Halimbawa 1: Pagdaragdag sa Record Page
Sa sitwasyong ito, ginagawa namin ang script ng LWC na 'firstComponent' na nagpapakita ng text na 'Idinagdag sa Record page' at idinaragdag ang component na ito sa page na 'Account Record.' Sa 'firstComponent.js-meta.xml' na file, kailangan naming tukuyin ang target bilang lightning__RecordPage.
Istraktura ng Code:
firstComponent.html
< template >< kard ng kidlat variant = 'Makitid' pamagat = 'Linux' >
< p >> Idinagdag sa pahina ng Record p >
kard ng kidlat >
template >
firstComponent.js
angkat { LightningElement } mula sa 'swerte' ;i-export ang default na klase na FirstComponent ay nagpapalawak ng LightningElement {
}
firstComponent.js-meta.xml
< ?xml bersyon = '1.0' ? >< LightningComponentBundle xmlns = 'http://soap.sforce.com/2006/04/metadata' >
< apiVersion > 57.0 apiVersion >
< isExposed > totoo isExposed >
< mga target >
< target > kidlat__RecordPage target >
mga target >
LightningComponentBundle >
Pagdaragdag ng isang Component:
Pumunta sa Salesforce Org at hanapin ang 'Sales' na app sa ilalim ng App Launcher.
Buksan ang anumang tala ng account sa pamamagitan ng pag-navigate sa tab na 'Mga Account'. Pumunta sa icon na gear at piliin ang 'I-edit ang Pahina'.
Ngayon, pumunta sa kaliwa at hanapin ang iyong bahagi.
I-drag ang component at ilagay ito sa ibaba ng “Highlights Panel”.
Mag-click sa 'I-activate' at italaga ito bilang default ng Org. Panghuli, i-save ang pahina ng talaan.
Tapos na. Ngayon, bumalik sa page ng app na 'Sales' at pumunta sa 'Rekord ng Account' (anumang record). Makikita mong idinagdag ang custom na bahagi.
Halimbawa 2: Pagdaragdag sa Home Page
Gamitin natin ang 'firstComponent'. Baguhin ang teksto ng talata bilang 'Idinagdag sa Home page' sa HTML file. Tukuyin ang target bilang “lightning__HomePage” sa “firstComponent.js-meta.xml” file.
firstComponent.html
< p > Idinagdag sa Home page < / p >
< / lightning-card>
< / template>
firstComponent.js-meta.xml
bersyon = '1.0' ?>< / mga target>
< / LightningComponentBundle>
Pagdaragdag ng isang Component:
Pumunta sa 'Sales' na app at mag-click sa tab na 'Home'.
Mag-click sa pahina ng pag-edit na magagamit sa ilalim ng icon na gear. Hanapin ang bahagi at ilagay ito sa itaas ng bahaging 'Pagganap'. I-save ang pahina.
I-refresh ang tab na 'Sales Home.'
Makikita natin na ang ating component ay idinagdag sa Home page.
Halimbawa 3: Pagdaragdag sa Pahina ng App
Gamitin natin ang 'firstComponent'. Baguhin ang teksto ng talata bilang 'Idinagdag sa pahina ng App' sa HTML file. Tukuyin ang target bilang “lightning__AppPage” sa “firstComponent.js-meta.xml” file.
firstComponent.html
< template >< kard ng kidlat variant = 'Makitid' pamagat = 'Linux' >
< p > Idinagdag sa page ng App p >
kard ng kidlat >
template >
firstComponent.js-meta.xml
bersyon = '1.0' ?>< / mga target>
< / LightningComponentBundle>
Pagdaragdag ng isang Component:
Una, kailangan nating gumawa ng page ng App sa Salesforce gamit ang Lightning App Builder. Maghanap para sa 'Lightning App Builder' sa 'Quick Find' at mag-click sa 'Bago' upang lumikha ng bagong lightning page.
Piliin ang page ng App at pumunta sa “Next”.
Ibigay ang label bilang 'Linuxhint App' at pumunta sa 'Next'.
Sa ngayon, kailangan lang namin ng isang rehiyon upang ilagay ang bahagi. Kaya, piliin ang 'Isang Rehiyon' at i-click ang 'Tapos na'.
Ngayon, i-drag ang 'firstComponent' sa pahina at i-save ang pahina.
Darating ang isang popup kung saan kailangang i-activate ang page. Mag-click sa 'I-activate'.
Pagkatapos nito, kailangan mong magdagdag ng page sa app. Pumunta sa tab na 'KARANASAN NG KIDID' at gawin ito. I-save ang activation na ito.
Ngayon, pumunta sa App Launcher at hanapin ang 'Linuxhint App'. Maaari mong makita na ang aming bahagi ay idinagdag sa pahina ng App.
Konklusyon
Ngayon, naiintindihan na namin kung paano magdagdag ng LWC sa page ng App, Home page, at page ng Record. Sa lahat ng mga sitwasyon, ginamit namin ang parehong mga halimbawa upang makakuha ng isang mas mahusay na ideya. Siguraduhin na ang 'isExposed' ay totoo. Kung hindi, hindi makikita ang bahagi sa Salesforce Org. Sa buong gabay na ito, ginamit namin ang editor ng Lightning Studio (Beta) upang bumuo ng code. Ang lahat ng mga hakbang ay ipinaliwanag sa kung paano i-download at gamitin ang editor na ito sa simula ng gabay na ito.