我是一个新来的前端,我在业余时间学习mithril.js,我认为它很棒。刚才我正在读一篇关于m.request()
的文章,但是有一件事我不明白。我将一个从服务器获取数据的组件放在它的oninit
函数中,以填充一个变量。在view
中使用相同的变量来显示数据,但是一旦请求返回,数据就不会被呈现。代码如下:
const m = require("mithril");
import Stuff from './stuff.js';
var WelcomePage = {
stufflist: [],
oninit: function(vnode) {
m.request({
method: "GET",
url: "wfd/stuff",
data: {offset:0, limit:5}
}).then((result) => {
WelcomePage.stufflist = result;
});
},
view: function(vnode) {
return (
<div>
Welcome! Have your stuff :)
<ul>
{
WelcomePage.stufflist.map(stuff => (
<li>
<Stuff stuff = {stuff}></Stuff>
</li>
))
}
</ul>
</div>
);
}
}
export default WelcomePage;
当然,请求以预期的内容结束,Stuff
组件工作得很好。我遗漏了什么?
更新:我忘记提到这个mithril页面位于我配置的反向代理之后。因为我从代理移动页面工作,所以错误可能在那里。这是我停靠的nginx:alpine
default.conf
文件:
server {
listen 80;
server_name stuff.dev;
#charset koi8-r;
#access_log /var/log/nginx/host.access.log main;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
}
location /wfd {
proxy_pass http://localhost:8080/;
}
}
发布于 2019-04-22 04:31:29
好吧..。问题是在主.js
文件中呈现了WelcomePage
组件。作为mithril.js
文档states,如果你想让你的组件从auto-redraw
系统中受益,你必须挂载它。所以,挂载我的WelcomePage
解决了我的“问题”。
发布于 2019-04-05 02:37:14
因为您可能只想更新组件的一个实例,而不是
WelcomePage.stufflist = result;
你可能想要
vnode.state.stufflist = result;
然后在您的视图中使用
vnode.state.stufflist.map(...)
注意:只要你不使用箭头函数,你就可以使用vnode.state
的this
。
https://stackoverflow.com/questions/55467831
复制相似问题