一道面试题 React

› React

This topic created in 3543 days ago, the information mentioned may be changed or developed.

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

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

不能修改 html 和 css 代码

代码

修改

tele

React

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

blanu

Mar 2, 2017

非常想知道答案

raquelken

Mar 2, 2017

render 到 body 上不行么？

czheo

Mar 2, 2017

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

markx

Mar 2, 2017

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

murmur

Mar 2, 2017

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

murmur

Mar 2, 2017

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

rashawn

Mar 2, 2017 via iPhone

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

不懂 react

JenJieJu

Mar 2, 2017 via iPhone

@raquelken + 1

finalspeed

Mar 2, 2017

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

blanu

Mar 2, 2017 via iPhone

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

yinfxs

Jun 16, 2018

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

Jun 16, 2018

看漏了，请忽略我的回复

yinfxs

Jun 16, 2018

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

Jun 16, 2018

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