- 上传者： Administrator
- 上传时间：2023年09月15日 01时45分59秒
摘要：
现在很清楚，应该有一个Task组件来封装任务的外观和行为。 这个Task组件将显示一个任务，但它不能拥有任务的状态:一段数据应该只有一个所有者。 否则就是自找麻烦。因此，Task组件将获得它的数据作为一个道具。 这意味着数据仍然由App组件拥有，但可以由Task组件使用(不需要修改)。 由于我们正在 ......
现在很清楚，应该有一个Task组件来封装任务的外观和行为。 这个Task组件将显示一个任务，但它不能拥有任务的状态:一段数据应该只有一个所有者。 否则就是自找麻烦。因此，Task组件将获得它的数据作为一个道具。 这意味着数据仍然由App组件拥有，但可以由Task组件使用(不需要修改)。 由于我们正在 ......
正文
相关文章
请喝咖啡
- 首先，我们现在有一个子组件Task，它定义在文件的顶部，
- 每当我们定义子组件时，都需要将其添加到其父组件的静态components key中，这样 Owl就能得到它的参考，
- Task组件有一个props键:这只对验证有用。 它说每个Task应该被赋予一个名为Task的道具。如果不是这样，Owl将抛出一个错误。这在重构组件时非常有用
- 最后，为了激活道具验证，我们需要将Owl的模式设置为dev。这在mount函数的最后一个参数中完成。 请注意，当应用程序在实际生产环境中使用时，应该删除此选项，因为由于额外的检查，开发模式稍微慢一些。
现在很清楚，应该有一个Task组件来封装任务的外观和行为。
这个Task组件将显示一个任务，但它不能拥有任务的状态:一段数据应该只有一个所有者。 否则就是自找麻烦。因此，Task组件将获得它的数据作为一个道具。 这意味着数据仍然由App组件拥有，但可以由Task组件使用(不需要修改)。
由于我们正在移动代码，这是一个重构代码的好机会:
// -------------------------------------------------------------------------
// Task Component
// -------------------------------------------------------------------------
class Task extends Component {
static template = xml /* xml */`
<div class="task" t-att-class="props.task.isCompleted ? 'done' : ''">
<input type="checkbox" t-att-checked="props.task.isCompleted"/>
<span><t t-esc="props.task.text"/></span>
</div>`;
static props = ["task"];
}
// -------------------------------------------------------------------------
// Root Component
// -------------------------------------------------------------------------
class Root extends Component {
static template = xml /* xml */`
<div class="task-list">
<t t-foreach="tasks" t-as="task" t-key="task.id">
<Task task="task"/>
</t>
</div>`;
static components = { Task };
tasks = [
...
];
}
// -------------------------------------------------------------------------
// Setup
// -------------------------------------------------------------------------
mount(Root, document.body, {dev: true});这里发生了很多事情:
- 微信扫一扫，一分也是爱:
-
服务原则及地区范围
宜兴通达网络科技有限公司，地处中国宜兴环科园内，是一家高新技术企业。公司在企业网络维护和企业信息化建设与咨询方面，有10多年经验。
我公司愿与客户一道，力求彻底解决客户问题！
我们不是在给企业提供“头痛医头、脚痛医脚”的暂时解决方案，而是在部署根本性安全与稳定服务！！
我们愿携手客户，建立企业IT规划；杜绝随意安装系统、软件等操作；力求共同维护有序、安全、稳定的网络办公环境！！！
IT服务，服务是根本，客户是上帝；我们提供快速响应、快速上门、快速排查，提供优质高效的服务！！！！
通达科技提供全国范围内的服务，服务形式包括远程协助、电话咨询、电子邮件咨询、传真咨询、问答平台的问题解决等。
宜兴地区提供上门服务：
- 市区服务：宜城街道、城北街道（屺亭街道）、新街街道、新庄街道、环科园、渚桥开发区
- 市郊服务：张渚镇、西渚镇、太华镇、徐舍镇、官林镇、杨巷镇、新建镇、和桥镇、高塍镇、万石镇、周铁镇、芳桥镇、丁蜀镇、湖父镇。
- 联系电话：189-21-343434
- 在线沟通：
