一道面试题 React

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

› React

这是一个创建于 2802 天前的主题，其中的信息可能已经有所发展或是发生改变。

http://codepen.io/TimJin/pen/wgbPOx

链接里的代码现在不能输出任何可见信息，请修改 js 代码使屏幕上可以看到 aoeu 。不能修改#app 节点属性(document.getElementById('app').style.display = "block"; 是无效答案)

不能修改 html 和 css 代码

代码

修改

tele

React

14 条回复 • 2018-06-16 14:01:19 +08:00

blanu

2017-03-02 03:44:34 +08:00

非常想知道答案

raquelken

2017-03-02 04:19:14 +08:00

render 到 body 上不行么？

czheo

2017-03-02 05:30:08 +08:00

是要这个意思吗？
componentDidMount() {
ReactDOM.findDOMNode(this).parentNode.style.display="block"
}

markx

2017-03-02 06:43:54 +08:00

呃要不然直接 document.write('aoeu')？

murmur

2017-03-02 07:47:48 +08:00

直接写一段内联 style disply 是 block!important 不就完了。。没说不准修改节点属性又没说不允许额外 css

murmur

2017-03-02 07:49:03 +08:00

*更正，是创建一个新的 style 节点

rashawn

2017-03-02 08:10:53 +08:00 via iPhone

让我写我会加个 three.js ……

不懂 react

JenJieJu

2017-03-02 08:23:15 +08:00 via iPhone

@raquelken + 1

finalspeed

2017-03-02 10:28:52 +08:00

感谢各位的回答, 我不懂 React, 也不知道答案, 所以上来问问 V 友,
@czheo #3, 测试可以显示"aoeu''.

blanu

2017-03-02 20:03:41 +08:00 via iPhone

@finalspeed 晕了，那个也是相当于修改了 dom 节点属性啊…我还以为你知道答案…

yinfxs

2018-06-16 12:35:27 +08:00

class Application extends React.Component {
render(){
return this.props.children;
}
}

//DO NOT MAKE CHANGES BELOW THIS LINE
ReactDOM.render(<Application><div>aoeu</div></Application>, document.body);

yinfxs

2018-06-16 13:36:00 +08:00

看漏了，请忽略我的回复

yinfxs

2018-06-16 14:00:33 +08:00

class Application extends React.Component {
componentDidMount() {
const _ = ReactDOM.findDOMNode(this);
_.parentNode.parentNode.append(_)
}
render(){
return this.props.children;
}
}

//DO NOT MAKE CHANGES BELOW THIS LINE
ReactDOM.render(<Application><div>aoeu</div></Application>, document.getElementById('app'));

yinfxs

2018-06-16 14:01:19 +08:00

这样不知道是不是标准答案，但是满足你说的要求：