[Salesforce]LWC基礎1

LWC基礎1

LWC構成

lwc
 lwcTest1
  lwcTest1.html
  lwcTest1.js
  lwcTest1.js-meta.xml

lwcTest1.html

<template>
    {testText}
</template>

lwcTest1.js

import { LightningElement } from 'lwc';

export default class LwcTest1 extends LightningElement {
    testText = 'Hello World';
}

lwcTest1.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>63.0</apiVersion>
    <isExposed>true</isExposed>
    <targets>
        <target>lightning__RecordPage</target>
    </targets>
</LightningComponentBundle>

上記のLWCを取引先詳細画面に追加します。

保存します。

有効化します。

取引先詳細画面でLWCが表示されていることを確認します。