【求助】avalon2 调用组件在ms-html显示,能不能重复使用onReady?
一个主页面,通过不同的链接切换不同的组件,每显示一个组件的时候,onReady和onDispose都会处理一些业务。
问题:当我重新打开某个组件的时候,onReady只有在初始化的时候调用了一次,再次就不执行了,而页面的一些业务因为在第一次onDispose时处理掉,再次回去的时候,要把处理掉的业务再重新恢复相关业务。因为onReady只执行一次,再回去时,就执行不了了。
注:多个页面回去此组件,所以不能在其他页面的onDispose处理,只能在该组件里处理。
求大神们解答!谢谢!
主页面:
js:
require('./dscan');
require('./dserver');
var vm = avalon.define({
$id : 'demos',
isView: !1,
title: '显示初始化标题',
view: '',
href: function (component, tit) {
var url = '#!/' + component + '&&' + tit;
window.location.href = url;
}
})
window.addEventListener('hashchange', function (e) {
var hash = e.newURL.split('#!/')[1].split("&&")[0];
vm.view = '<' + hash + ' cached="true" ms-widget="{$id:\'' + hash + '\'}"></' + hash + '>';
})
html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>Title</title>
</head>
<body ms-controller="demos">
<h1 class="view-title">
{{@title}}
</h1>
<ul>
<li ms-click="@href('ms-scan','扫一扫')">
扫一扫
</li>
<li ms-click="@href('ms-server','服务')">
服务
</li>
</ul>
<div ms-html="@view"></div>
</body>
</html>
组件:
<ms-scan>
js:
var temp = require('../_views/dscan.html');
var isView = document.querySelector('.view-title');
avalon.component('ms-scan', {
template: temp,
defaults: {
dred: 'red',
dtitle: "初始化标题已被隐藏",
dcon: "",
onReady: function () {
// 隐藏“初始化标题”
avalon(isView).css('display','none')
},
onDispose: function () {
// 显示“初始化标题"
this.dcon = '初始化标题再不会被隐藏'
avalon(isView).css('display','')
}
}
});
html:
<div class="ms-scan">
<h1>
{{@dtitle}}
</h1>
<h3>
我是扫一扫
</h3>
<div ms-css="{color: @dred}">
{{@dcon}}
</div>
</div>
<ms-server>
js:
var temp = require('../_views/dserver.html');
avalon.component('ms-server', {
template: temp,
defaults: {
stitle: "初始化标题又显示了",
onReady: function () {
},
onDispose: function () {
}
}
});
html:
<div class="ms-server">
<h1>
{{@stitle}}
</h1>
<h3>
我是服务
</h3>
</div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
给我一个完整的页面啊,这样人家才能跑起来试验
主页面:
js:
html:
组件:
<ms-scan>
js:
html:
<ms-server>
js:
html: