LWC
-
DataTable in Lightning Web Component (LWC)LWC 2024. 4. 6. 00:28
1. 이란?LWC의 DataTable 구성 요소는 Salesforce에서 표 형식 데이터를 표시하고 상호 작용하는 데 필수적인 도구 2. datatable에서 보여줄 List와 Columns 생성 2-1 : data List 생성 //js파일import { LightningElement, track, api } from 'lwc'; export default class Kk_gwiseok extends LightningElement { @track data = []; connectedCallback() { const data = [ { id:'123', TemplateTitle__c:'공급계약서', TemplateId__c:' tmplate01'}, ..
-
lwc 페이지 리다이렉트 방법 - NavigationMixin, widow.location.href ( How to redirect lwc page - NavigationMixin, widow.location.href )LWC 2024. 4. 5. 15:02
1. NavigationMixin 1-1 : import { NavigationMixin } from 'lightning/navigation'; /* js 파일 */ import { LightningElement,wire, track, api } from 'lwc'; import { NavigationMixin } from 'lightning/navigation'; 1-2 : extends NavigationMixin(LightningElement) { ... } export default class zz_clvs_MDE_Template_Create extends NavigationMixin(LightningElement) { .... } 1-3 : this[NavigationMixin.Navigate]..
-
lwc for:each 에서 index 활용하는 방법 - How to use index in lwc for:eachLWC 2024. 3. 27. 22:42
1. LWC 반복문 2. 추가 3. 반복되는 행에 index 및 event 부여 data-index={인덱스} onclick = {이벤트} {pli.Name} {pli.UnitPrice} 4. event로 부여한 index 가져오기 및 활용 index 체크 -> const index = event.target.dataset.index; index 활용 -> this.리스트[index]; //js파일 addOrderList(event){ const index = event.target.dataset.index; co..
-
LWC 성공, 실패, 에러 알람 띄우기 (ShowToast) - Display success, failure, and error alarm messagesLWC 2024. 3. 19. 22:26
1. import {ShowToastEvent} 및 showToast 메서드 생성 JS 파일 import { ShowToastEvent } from 'lightning/platformShowToastEvent'; showToast(title, message, variant){ ... } showToast 메서드 호출 import { ShowToastEvent } from 'lightning/platformShowToastEvent'; //1번 export default class zz_clvs_MDE_Template_Create extends LightningElement { //취소버튼 클릭 시 전자계약 템플릿 개체 목록보기 페이지로 이동 returnListVeiw(event){ var titleInp..
-
lwc 로딩 중 아이콘 화면에 표시하기 (Spineer) - Displaying icon on screen while loading LWCLWC 2024. 3. 19. 22:21
1. 를 사용하면 된다. 2. 작업예시 //JS파일 import { LightningElement, track } from 'lwc'; export default class MyComponent extends LightningElement { @track isLoading = false; // 백엔드 작업을 수행하는 메서드 handleBackendWork() { // 작업 중인 상태를 true로 설정하여 작업 중 아이콘을 화면에 보여줌 this.isLoading = true; // 백엔드 작업 수행 // (예: Apex 호출, 비동기 작업 등) // 작업이 완료되면 작업 중인 상태를 false로 설정하여 아이콘을 감춤 this.isLoading = false; } } 3. developer 라이브러리 참..
-
LWC 컴포넌트 url로 호출하는 방법 - How to call with LWC component urlLWC 2024. 3. 18. 21:46
원래 불가능했는데 가능하게 수정되었다! 2024 summer https://gsohclvs.tistory.com/entry/LWC-%EC%BB%B4%ED%8F%AC%EB%84%8C%ED%8A%B8-url%EB%A1%9C-%ED%98%B8%EC%B6%9C%ED%95%98%EB%8A%94-%EB%B0%A9%EB%B2%95-How-to-call-with-LWC-component-url-1 LWC 컴포넌트 url로 호출하는 방법 - How to call with LWC component url원하던 기능이 드디어 Release 되었다! 기존에는 lwc 컴포넌트를 url로 직접 호출하는 것이 불가능하여불필요한 aura 컴포넌트를 생성하고 url로 aura 컴포넌트를 호출하여aura 컴포넌트 내부에서 lwcgso..