Reactivity for GameCreator: 用于 Game Creator 游戏制作工具的 Reactivity 插件借鉴 Vue 3 响应式 API 实现

![ReactivityLogo](https://images.gitee.com/uploads/images/2021/0810/184124_64a4a58a_5053644.png)

# Reactivity 插件

***用于 Game Creator 游戏制作工具***

> 借鉴 Vue 3 响应式 API 实现

[下载 Reactivity 插件](http://f.gamecreator.com.cn/plug.php?id=275)

## 示例

### 计数器：

```typescript
// 引入响应式 API
const { ref, model } = Reactivity
// 获取 UI 对象
const { label2, button2 } = GameUI.get(1) as GUI_1

// 创建响应式变量，初始值：0
const count = ref(0)
// 将变量绑定到 label2 UI 上
model(label2, count)

// 点击按钮时自增 count.value 的值
button2.on(EventObject.CLICK, this, () => {
    count.value++
})
```

### 输入值绑定到一个文本框:

```typescript
// 引入响应式 API
const { ref, model, effect } = Reactivity
// 获取 UI 对象
const { input1, label1 } = GameUI.get(1) as GUI_1

// 创建响应式变量
const inputVal = ref('Hello, Reactive!')
// 将响应式变量绑定到输入组件
model(input1, inputVal)

// 响应式变量更新时赋值给文本显示组件
effect(() => label1.text = inputVal.value)
```

### 反转输入:

```typescript
const { ref, model, effect } = Reactivity
const { input2, button1 } = GameUI.get(1) as GUI_1

// 创建响应式变量
const inputVal = ref('你好，世界！')

// 建立输入框和响应式变量的双向绑定
model(input2, inputVal)

// 按钮点击后反转字符串，并重新赋值回去
button1.on(EventObject.CLICK, this, () => {
    inputVal.value = inputVal.value.split('').reverse().join('')
})
```

### 将输入值转换为大写:

```typescript
const { ref, model, computed, effect } = Reactivity
const { input3 } = GameUI.get(1) as GUI_1

// 创建响应式变量
const originalVal = ref('abcdefg')

// 创建一个计算函数
const computeVal = computed(
    // Getter 方法，监听响应式对象的变化，并将方法返回值传入响应式：“ref” 变量中
    () => {
    	return originalVal.value.toUpperCase()
    },
	// Setter 方法，改变 computeVal.value 的值时，会调用其中的方法
    val => {
    	originalVal.value = val
    }
)
// 将计算函数绑定到 input3 上
model(input3, computeVal)
```

*可以使用 isReactive 和 isRef 判断对象是否为响应式对象*

> 暂不支持创建 Map, Set, WeakMap, WeakSet 类型的响应式对象

LittleSound/Reactivity for GameCreator

简介

发行版

贡献者

近期动态

LittleSound/Reactivity for GameCreator .gitee-modal { width: 500px !important; }

简介

发行版

贡献者

近期动态

搜索帮助

LittleSound/Reactivity for GameCreator