<commit_before># Concepts

[以中文版查看此文](https://dvajs.com/guide/concepts.html)

## Data Flow

<img src="https://zos.alipayobjects.com/rmsportal/PPrerEAKbIoDZYr.png" width="807" />

## Models

### State

`type State = any`

The state tree of your models. Usually, the state is a javascript object(Technically it can be any type), which is a immutable data.

In dva, you can access top state tree data by `_store`.

```javascript
const app = dva();
console.log(app._store); // top state
```

### Action

`type AsyncAction = any`

Just like Redux's Action, in dva, action is a plain object that represents an intention to change the state. Actions are the only way to get data into the store. Any data, whether from UI events, network callbacks, or other sources such as WebSockets needs to eventually be dispatched as actions.action.(ps:dispatch is realized through props by connecting components.)

```javascript
dispatch({
  type: 'add',
});
```

### dispatch function

`type dispatch = (a: Action) => Action`

A dispatching function (or simply dispatch function) is a function that accepts an action or an async action; it then may or may not dispatch one or more actions to the store.

Dispatching function is a function for triggering action, action is the only way to change state, but it just describes an action. while dispatch can be regarded as a way to trigger this action, and Reducer is to describe how to change state.

```javascript
dispatch({
  type: 'user/add', // if in model outside, need to add namespace
  payload: {},
});
```
<commit_msg>Minor readability corrections to Concepts.md<commit_after># Concepts

[以中文版查看此文](https://dvajs.com/guide/concepts.html)

## Data Flow

<img src="https://zos.alipayobjects.com/rmsportal/PPrerEAKbIoDZYr.png" width="807" />

## Models

### State

`type State = any`

The state tree of your models. Usually, the state is a JavaScript object (although technically it can be any type) which is immutable data.

In dva, you can access top state tree data by `_store`.

```javascript
const app = dva();
console.log(app._store); // top state
```

### Action

`type AsyncAction = any`

Just like Redux's Action, in dva, action is a plain object that represents an intention to change the state. Actions are the only way to get data into the store. Any data, whether from UI events, network callbacks, or other sources such as WebSockets needs to eventually be dispatched as actions.action. (PS: dispatch is realized through props by connecting components.)

```javascript
dispatch({
  type: 'add',
});
```

### dispatch function

`type dispatch = (a: Action) => Action`

A dispatching function (or simply dispatch function) is a function that accepts an action or an async action; it then may or may not dispatch one or more actions to the store.

Dispatching function is a function for triggering action, action is the only way to change state, but it just describes an action. while dispatch can be regarded as a way to trigger this action, and Reducer is to describe how to change state.

```javascript
dispatch({
  type: 'user/add', // if in model outside, need to add namespace
  payload: {},
});
```

{'fraction_non_alphanumeric': 0.0932741116751269, 'fraction_numerical': 0.0019035532994923859, 'mean_word_length': 4.353140916808149, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 7, 'https://': 4, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1305312', 'n_tokens_mistral': 916, 'n_tokens_neox': 877, 'n_words': 437}