Any State


https://github.com/vyquocvu/anystate


Để hiểu cái state nó gì thì mình quyết viết luôn một cái thư viện rồi dùng thử nó xem sao.

Cơ sự là lúc đầu đang tìm hiểu bí kíp võ công mới ‘solidjs’ tính làm mấy chiêu thứ cao siêu hơn

thì đột nhiên thấy ràng store của chán quá, thế là tự mình đưa ra ý tưởng về một store management

đơn giản chỉ có một object trung tâm. khi app sử dụng thì kéo object đó về dùng, xong rồi

muốn lắng nghe phần nào có thay đổi thì đặt lên đó một hàm watch và callback function

để xử lý. Không biết đặt tên nó là gì nên mình đặt tạm là anystate.


AnyState

  • Căn bản ý tưởng của mình đưa ra AnyState như một object json, bạn có thể
  • Khởi tạo (createStore)
  • Cập nhật (setItem)
  • Xem (getItem)
  • Callback (watch) trên từng phần tử mà bạn muốn theo dõi sự thay đổi của nó

→ mỗi lần setItem chạy thì sẽ kiểm tra item đó có đang được lắng nghe không? nếu có thì thực hiện

hàm callback đang lắng nghe đó


Cách dùng AnyState:


createStore()


const anyState =  createStore({
    name: 'John',
    age: 30,
    children: [{
      name: 'Bob',
      age: 5,
    }]
  });


Set state

  anyState.setState({
    name: 'John',
    age: 32,
    children: [{
      name: 'Bob',
      age: 4,
    }]
  });


Get state

  const state = anyState.getState();


Set item

  const path = 'children[0].name'; // the path to the item
  anyState.setItem(path, 'Jane');


Get item

  const path = 'children[0]';
  const child = anyState.getItem(path);


Watch onChange

  const path = 'name'; // path to item
  anyState.watch(path, (nextState, prevState) => {
     // do anything
  });



Phương châm của mình luôn là KISS (Keep It Simple Stupid), cho nên AnyState viết theo kiểu đơn giản nhất có thể.

Thankyou for reading!


Btw I'm Ryan