And it is provides the CRUD option. So, it is easy to create, read, update and delete the item in list.

And it is allows to do filter and sort operation.

It is supports mj-drop-down list.

render () {
    const listInfo = {
         list: [
             {id: 1, firstName: 'james', lastName: 'mj', companyInfo: { id: 1}, mobileNo: '9876543212'},
             {id: 2, firstName: 'chris', lastName: 'james', companyInfo: { id: 2}, mobileNo: '9876556789'},
             {id: 3, firstName: 'chris', lastName: 'cd', companyInfo: { id: 2}, mobileNo: '9876543222'},
             {id: 4, firstName: 'james', lastName: 'chris', companyInfo: { id: 3}, mobileNo: '9876543111'},
             {id: 5, firstName: 'james', lastName: 'mj', companyInfo: { id: 1}, mobileNo: '9876543212'},
     
          ], //List of item source
         fields: [
             { name: 'id', title: 'ID', notEditable: true},
             { name: 'firstName', title: 'First Name'},
             { name: 'lastName', title: 'Last Name'},
             { name: 'companyInfo', title: 'Companies', type: 'list',
                 actions: {
                     doSelect: (item) => { console.log('Selected item info', item) },
                 },
                 options: [{
                     id: 1,
                     name: 'Apple',
                 },{
                     id: 2,
                     name: 'Google',
                 },{
                     id: 3,
                     name: 'Amazon',
                 }],
             },
             { name: 'mobileNo', title: 'Mobile number'}
         ],
         actions: {
             doAdd: (item) => { console.log('$ListManagement$ - Add item action - item', item)},
             doUpdate: (item) => { console.log('$ListManagement$ - Update item action - item', item)},
             doDelete: (item) => { console.log('$ListManagement$ - Delete item action - item', item)},
         },
     };
    return (
        <MJList listInfo={listInfo}/>
    );
};

}