Hello friends, In this post you will see an example that helps you to bind data in lighting datatable using lightning web component(lwc). Lightning datatable component displays tabular data for list of records. So let's see an example to better understanding.

Show data in datatable in lighting web component

In this example, I have used account object records. You can use any object as per your need.

AccountHandler.apxc

 public class AccountHandler {
    @AuraEnabled(cacheable=true)
    public static List<Account> getAccountList() {
        return [SELECT Id, Name, Type, Rating, Phone, Website, AnnualRevenue FROM Account order by name asc limit 20];
    }
 }
AccountDataTable.html
 <template>
 <lightning-card title="Account Datatable">
	<template if:true={accList}>
		<lightning-datatable data={accList} columns={columns} key-field="Id">
		</lightning-datatable>
	</template>
	<template if:true={error}>
		{error}
	</template>
 </lightning-card>
 </template>
AccountDataTable.js
 import { LightningElement, wire, track } from 'lwc';
 import getAccountList from '@salesforce/apex/AccountHandler.getAccountList';
 export default class AccountDataTable extends LightningElement {
    @track columns = [{
        label: 'Account name',
        fieldName: 'Name',
        type: 'text'
    },
    {
        label: 'Type',
        fieldName: 'Type',
        type: 'text'
    },
    {
        label: 'Annual Revenue',
        fieldName: 'AnnualRevenue',
        type: 'Currency'
    },
    {
        label: 'Phone',
        fieldName: 'Phone',
        type: 'phone'
    },
    {
        label: 'Website',
        fieldName: 'Website',
        type: 'url'
    },
    {
        label: 'Rating',
        fieldName: 'Rating',
        type: 'text'
    }
    ];

    @track error;
    @track accList;
    @wire(getAccountList) wiredAccounts({ error, data }) {
        if (data) {
            this.accList = data;
        } else if (error) {
            this.error = error;
        }
    }
 }
AccountDataTable.js-meta.xml
 <?xml version="1.0"?>
 <LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
	<apiVersion>51.0</apiVersion>
	<isExposed>true</isExposed>
	<targets>
		<target>lightning__RecordPage</target>
		<target>lightning__HomePage</target>
	</targets>
 </LightningComponentBundle>

Note: Please add the above LWC component in your home page or record page to see the output. I have added it on home page. 

Output:


Hope you like this post, for any feedback or suggestions please feel free to comment. I would appreciate your feedback and suggestions.

Happy Coding
Thank you.