双向绑定

观察者也支持双向绑定，使元素既能发送，也能接收更新。下例在两个文本输入框之间建立双向绑定，任一输入框都可以更新另一个。示例使用 React，展示 React 组件的绑定方式。

实现步骤

首先导入组件、绑定类和 PCUI 样式。

import { Observer } from '@playcanvas/observer';
import { TextInput, BindingTwoWay } from '@playcanvas/pcui';
import '@playcanvas/pcui/styles';

为包含文本字符串的对象创建观察者。

const observer = new Observer({
    text: 'Hello World'
});

创建两个输入框，使两者均能通过关联观察者发送和接收更新。通过作为属性传入的 BindingTwoWay 对象定义此绑定方式。

const link = { observer, path: 'text' };
const TextInput1 = () => <TextInput binding={new BindingTwoWay()} link={link} />
const TextInput2 = () => <TextInput binding={new BindingTwoWay()} link={link} />