Lightning Web Component Datatable

Let us discuss here a simple example of Lightning Web Component Data table.A lightning-datatable component displays tabular data where each column can be displayed based on the data type. For example, an email address is displayed as a hyperlink with the mailto: URL scheme by specifying the email type. The default type is text.

1. Create an apex class 

Create an Apex class that will get all opportunities. Use the below SFDX Command

Here is the code

2. Create a Lightning Web Component 

Create a Lightning web component using this SFDX command. this web component will display the opportunities in the table.

Here is the DatatableEx.html code

Here is the DatatableEx.js JavaScript controller code.

Use this DatatableEx.js-meta.xml configuration file

 

3. Push Changes to scratch org

Use the below SFDX command to push the changes to scratch org

 

Now add this component to record page using lightning app builder and save it. you can able to see the below data table with the list of opportunities.