v2.0.0

New Vue Wrapper For TOAST UI Grid 4.0 🎉🎉🎉

Breaking Changes

Data Source

// v1.0.0
const columns = [/* ... */];
const netOptions = {
  perPage: 10,
  api: {
    readData: 'api/readData'
  }
};

const MyComponent = () => (
  <Grid 
    columns={columns}
    addon={{Net: netOptions}}
  />
);

// v2.0.0
const columns = [/* ... */];
const dataSource = {
  withCredentials: false,
  initialRequest: true,
  api: {
    readData: {url: 'api/readData', method: 'GET'}
  }
};

const MyComponent = () => (
  <Grid 
    columns={columns} 
    data={dataSource} 
    pageOptions={{perPage: 3}}
    onSuccessResponse={(data) => {
      console.log(data);
    }}
  />
);

With React Hooks

React Hooks can be used together.

import React, {useCallback} from 'react';

const MyComponentWithHooks = () => {
  const onClick = useCallback(() => {
    console.log('condition:', condition);
  }, [condition]);

  return <Grid columns={columns} data={data} onClick={onClick} />;
};

API Document

• https://nhn.github.io/tui.grid/latest