我有一个模板,显示一个用户ID为的QRCode:
<template name="pairDevice">
{{#with currentUser}}
<div id="qrcode"></div>
<div class="key" id="qrcodeValue" style="display: none;">{{id}}</div>
{{/with}}
</template>
我尝试设置渲染值和帮助器中的值,但问题始终是$('#qrcode')
和$('#qrcodeValue')
返回[]
,因为字段尚不存在。
Template.pairDevice.rendered = function(){
if (!location.origin) {
location.origin = location.protocol+"//"+location.host;
}
// $('#qrcode').qrcode({width : 128, height :128 ,text : $('#qrcodeValue').html()});
};
Template.pairDevice.helpers({
'id' : function(){
var appUser =Meteor.user();
var value = location.origin + ";" + appUser._id + ";" + appUser.emails[0].address;
$('#qrcode').qrcode({width : 128, height :128 ,text : value});
return value;
}
});
我知道Blaze只渲染一次,但是如何在DOM完成后渲染它?
由于
答案 0 :(得分:1)
将{{#with currentUser}}
移到模板外面。
<template name="pairDevice">
<div id="qrcode"></div>
<div class="key" id="qrcodeValue" style="display: none;">{{id}}</div>
</template>
<!-- call it like this -->
{{#with currentUser}}
{{> pairDevice}}
{{/with}}
当您第一次刷新页面时,我认为currentUser
在客户端使用其恢复令牌进行身份验证时会在短时间内未定义。因此,首次呈现pairDevice
时,currentUser
未定义,因此调用#qrcode
回调时,两个div #qrcodeValue
和rendered
不存在。通过移动模板外部,在pairDevice
定义之前,currentUser
模板根本不会呈现。