Question

我是React的新手，我正在尝试理解以下基本内容：

是否可以动态地将传递给组件的值作为props进行操作？例如。通过客户端的控制台？这是否会导致该组件的重新出现？

我知道可以将一个值从其父组件传递给子组件，并且一旦父组件重新呈现，子组件也会被重新呈现为新值。

但是你可以通过某种方式直接操纵传递的值来实现相同的行为吗？ e.g。

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

ReactDOM.render(
  <Welcome name="Sara" />,
  document.getElementById('root')
);

输出是：你好，萨拉

我希望在不使用父元素的情况下实现这样的目标：

 function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}
var name = "test"; 
ReactDOM.render(
  <Welcome name={name} />,
  document.getElementById('root')
);

输出是：＆＃34;测试＆＃34;

现在，如果我在控制台中将名称设置为name = "X"，它什么都不会改变，名称似乎是一个完全不同的变量。

Answer 1

回答你的问题：在控制台中输入变量（让我们假设你使用的是chrome dev工具）不会影响你编写的reactjs代码。

如果在页面加载后在控制台级别更改变量，则原始变量“name”将使用指定的值“test”进行渲染。

是否可以动态地操作传递给组件的值作为Props？

1 个答案: