Mẹo nhỏ: Để tìm kiếm chính xác các bài viết của Vuihecungchocopie.vn, hãy search trên Google với cú pháp: "Từ khóa" + "vuihecungchocopie". (Ví dụ: công thức giải rubik 3x3 vuihecungchocopie). Tìm kiếm ngay
9 lượt xem

Vuex là gì

Bạn đang xem: Vuex là gì Tại Vuihecungchocopie                        

Bạn đang quan tâm đến Vuex là gì phải không? Nào hãy cùng Vuihecungchocopie đón xem bài viết này ngay sau đây nhé, vì nó vô cùng thú vị và hay đấy!

i. Tại sao bạn cần vuex?

vuejs là một khuôn khổ mới và ngày càng phổ biến. Vuejs được xây dựng trên hệ thống component, nó trực tiếp truyền dữ liệu giữa các thành phần giữa các thành phần cha – con. Vẫn còn nhiều hạn chế trong việc đồng bộ các biến toàn cục như người dùng đã đăng nhập, chưa đăng nhập, tên người dùng. Vì vậy cần có giải pháp để giải quyết vấn đề xử lý và đồng bộ dữ liệu toàn cầu. Nếu ai đó đã sử dụng react thì có lẽ họ không lạ gì với redux, vì vậy vuejs cũng cần một cách quản lý dữ liệu như redux của react, đó là vuex.

ii.vuex là gì?

vuex là thư viện giúp quản lý trạng thái của các thành phần trong vuejs, là nơi lưu trữ dữ liệu tập trung cho tất cả các thành phần trong một ứng dụng, theo nguyên tắc trạng thái chỉ có thể thay đổi theo một cách nhất định. có thể được dự đoán.

Bạn đang xem: Vuex là gì

vuex được coi là thư viện quản lý nhà nước cho các ứng dụng vue. , sử dụng cửa hàng toàn cầu tập trung cho tất cả các thành phần trong ứng dụng của bạn, tận dụng hệ thống đáp ứng để cập nhật tức thì.

Cửa hàng vuex được xây dựng theo cách mà trạng thái của nó không thể thay đổi từ bất kỳ thành phần nào. Nó được đảm bảo rằng trạng thái chỉ có thể thay đổi theo những cách có thể dự đoán được. Vì vậy, cửa hàng của bạn trở thành một nguồn đáng tin cậy: mỗi phần tử dữ liệu chỉ được lưu một lần và ở chế độ chỉ đọc để tránh các thành phần ứng dụng khỏi trạng thái hỏng được truy cập từ các thành phần khác. state được hiểu là trạng thái của ứng dụng. Ví dụ, ứng dụng sẽ có trạng thái là đã đăng nhập hay chưa.

XEM THÊM:  Trung thành là gì? Đâu là biểu hiện của một nhân viên trung thành

alt text

Ba. Ảnh hưởng của vuex?

Đầu tiên là về vue. vue chia nhỏ và quản lý trạng thái trong từng thành phần, điều này mang lại nhiều lợi ích như: dễ sử dụng lại mã, giảm độ phức tạp của ứng dụng, việc kiểm tra trở nên dễ dàng hơn … nhưng một ngày nào đó sẽ có 3, 4 … n Điều gì sẽ xảy ra nếu hai thành phần cùng dùng chung trạng thái?

Xem thêm: On board là gì?

Cách dễ nhất là mỗi thành phần sử dụng các sự kiện để gửi trạng thái cho các thành phần khác sử dụng và tự kích hoạt khi trạng thái thay đổi. Ngoài ra, một thành phần mẹ có thể được tạo như một bộ truyền trạng thái. Cả hai phương pháp đều làm cho quy trình làm việc phức tạp hơn và khó kiểm soát (và thường khó gỡ lỗi).

Bốn. kiến trúc vuex

Với vuex, trạng thái của ứng dụng được quản lý tập trung tại một nơi gọi là cửa hàng, bao gồm 5 phần chính:

Mô-đun hành động đột biến của State Getter

1. Trạng thái

trạng thái là một đối tượng chứa toàn bộ trạng thái của ứng dụng

2. getter

là một tập hợp các hàm được sử dụng để lọc trạng thái để có được kết quả đầu ra mong muốn.

Được sử dụng trong các thành phần có thể gọi trực tiếp mã này. $ store.getters.getevennumbers hoặc sử dụng mapgetter

3. Đột biến

Xem thêm: Tin tức Bkav – Bkav Corporation

XEM THÊM:  Windows server là gì? Ưu điểm và các chức năng của máy chủ windows - Nhà cung Cấp Hosting - Tên Miền - Cloud VPS | BKNS

Kho lưu trữ là nơi các thành phần chỉ có thể đọc dữ liệu và không thể trực tiếp thay đổi trạng thái. Để thay đổi trạng thái, các đột biến xử lý chức năng này, đây là nơi duy nhất mà trạng thái có thể được thay đổi. Các đột biến sẽ cam kết các thay đổi thông qua cam kết. Cũng có thể gửi đột biến trong các thành phần, nhưng điều này không được khuyến khích để đảm bảo quy trình chuẩn mà tôi sẽ thảo luận dưới đây. Một điều cần lưu ý là các đột biến được đồng bộ hóa để kiểm soát cách các hành động thay đổi trạng thái hoặc thứ tự thay đổi trạng thái

4. Hành động

hành động tương tự như đột biến, nhưng với một số khác biệt, hành động thực hiện các thay đổi thay vì thay đổi trạng thái. hành động có thể chứa các hoạt động không đồng bộ. , là nơi biểu diễn logic nghiệp vụ. Đó là nơi để gọi api, lưu vào cơ sở dữ liệu, cam kết (gọi một đột biến) để thay đổi trạng thái … ví dụ: thêm một số, xóa và thêm lại nó nếu nó đã tồn tại trong trạng thái.

Ngược lại với đột biến, các hành động không đồng bộ. Đơn giản vì các hành động có thể không liên quan về mặt logic.

4. Mô-đun

vuex sử dụng một cây trạng thái duy nhất, trong đó tất cả trạng thái của ứng dụng được đặt trong một đối tượng, vì vậy bộ nhớ có thể phát triển rất nhiều khi ứng dụng phát triển. Vuex cho phép phân rã cửa hàng thành các mô-đun nhỏ hơn, mỗi mô-đun có trạng thái, đột biến, hành động, getter, và thậm chí cho phép các mô-đun lồng nhau.

XEM THÊM:  Những Cô Nàng &39 Sát Trai Là Gì ? Chuyện Những Cô Nàng &39Sát Trai&39

Là một cửa hàng vi mô, nó cũng bao gồm: trạng thái, đột biến và hành động. Khi cửa hàng quá lớn, có thể chia nhỏ thành các phân hệ để quản lý dễ dàng hơn.

v. Những điều cần nhớ khi sử dụng vuex

Xác định trạng thái để lưu trữ trong bộ nhớ, tức là trạng thái cục bộ chỉ nằm trong thành phần. Tất nhiên là có đưa mọi thứ vào store nhưng khi dung lượng app ngày càng lớn thì store cũng phát triển theo => việc quản lý nhà nước sẽ trở nên khó khăn hơn.

Kết luận

Nếu bạn đang sử dụng vuejs và gặp sự cố khi đồng bộ hóa, hiển thị và cập nhật dữ liệu, dữ liệu được sử dụng bởi nhiều thành phần, vuex là giải pháp cho bạn. Các ứng dụng vuejs lớn hầu như luôn cần sử dụng vuex để quản lý và xử lý thay đổi trạng thái hiệu quả nhất. Đây chỉ là phần giới thiệu sơ lược về vuex, nếu bạn đã biết về flux / redux thì sẽ dễ dàng làm quen với vuex, nhưng nếu bạn chưa đọc thì sẽ khá mơ hồ. Qua bài viết này, hy vọng các bạn đã hiểu rõ hơn về vuex và sử dụng đúng theo ứng dụng của mình. Hướng dẫn chi tiết sẽ được giới thiệu trong bài viết sau,

Xem thêm: Nhuc dau chong mat kho tho la benh gi

Công khai: VUIHECUNGCHOCOPIE.VN là trang web Tổng hợp Ẩm Thực - Game hay và Thủ Thuật hàng đầu VN, thuộc Chocopie Vietnam. Mời thính giả đón xem.

Chúng tôi trân trọng cảm ơn quý độc giả luôn ủng hộ và tin tưởng!

Trả lời

Email của bạn sẽ không được hiển thị công khai.