小编Sag*_*b.g的帖子

我刚刚通过React-bootstrap表单,它的用途controlId是什么,它类似于name我们在遗留形式中使用的？

<form>
    <FormGroup
      controlId="formBasicText" ---------------------->> what is the use?
      validationState={this.getValidationState()}
    >
      <ControlLabel>Working example with validation</ControlLabel>
      <FormControl
        type="text"
        value={this.state.value}
        placeholder="Enter text"
        onChange={this.handleChange}
      />
      <FormControl.Feedback />
      <HelpBlock>Validation is based on string length.</HelpBlock>
    </FormGroup>
  </form>

我一直在遵循使用 useContext 将减速器传递给子组件的指南，但是当从子组件分派时，它似乎没有重新渲染父组件。

从子组件分派时，状态本身似乎正确更新（如通过 console.logging state.count 完成的），但父组件不反映状态的更改。

我尝试将调度函数作为道具传递给 Child，这确实更新了 App.js，但我认为我的方法更干净，我可能会做错什么。我还放入{state.count}了 Child.js 并且它确实得到了正确更新，但对于这种情况我需要它在父组件中。这是代码：

应用程序.js

import React, { useReducer } from 'react';
import { StateProvider } from './reducer';
import Child from './Child'

function App() {
    const reducer = (state, action) => {
        switch (action.type) {
            case 'add':
                console.log(state.count+1)
                return {...state, count: state.count + 1}
            default:
                throw new Error();
        }
    }

    const initialState = {count: 1};
    const [state, dispatch] = useReducer(reducer, initialState)

    return (
        <StateProvider initialState={initialState} reducer={reducer}>
            <div className="App">
                {state.count}
                <Child></Child> …

我知道有几个关于这个主题的讨论,但没有一个真正回答我的确切问题.我正在寻找一种方法,如果当前登录的用户具有管理员权限,将远程检查.他是否是本地内置"管理员"组的成员或"管理员"内嵌套组的成员,例如"域管理员".我发现了几种方法,但每种方法只提供一半解决方案.

方法#1(远程工作,但只检查本地"管理员"组):

private bool isAdmin()
{
    ArrayList mem2 = new ArrayList();
    string hostName = basicinfomodel.Loggedusername; //a username I get from another class
    try
    {
        using (DirectoryEntry machine = new DirectoryEntry("WinNT://" + mycomputer.myComputerName)) // remote computer that I get from another class
        {
            //get local admin group
            using (DirectoryEntry group = machine.Children.Find("Administrators", "Group"))
            {
                //get all members of local admin group
                object members = group.Invoke("Members", null);
                foreach (object member in (IEnumerable)members)
                {
                    //get account name
                    string accountName = new …

我很反应并遵循教程.教师正在使用axios从github api中提取一些数据.以下是他建议的onSubmit事件处理程序:

handleSubmit = (event) => {
    event.preventDefault();
  console.log('event: form submit ' + this.state.userName )
  axios.get('https://api.github.com/users/${this.state.userName}')
    .then(resp => {
        console.log(resp)
    });

}

但是,当我运行它时,this.state.userName没有得到解决,我收到404.代码是否有问题或axios更新？我正在使用jscomplete/repl playground来处理它.

帮助赞赏!

以下是组件代码:

class Form extends React.Component {

    state = {
userName: '  ',
event: ' '
}

handleSubmit = (event) => {
    event.preventDefault();
  console.log('event: form submit ' + this.state.userName )
  axios.get('https://api.github.com/users/${this.state.userName}')
    .then(resp => {
        this.setState({event: resp})
    });
  console.log(event)
}

render() {
  return (
    <form onSubmit={this.handleSubmit}>
      <input type="text"
                    value={this.state.userName}
        onChange={(event) => this.setState({userName: event.target.value})}
                    placeholder={ this.state.username …

有人对如何在 React DetailsList 中聚焦按钮有建议吗？参考似乎是要走的路，我想做这样的事情：

        findDOMNode<HTMLButtonElement>(this.refs.mybutton).focus()

但是我一直无法在按钮元素上获得 ref 句柄。

我尝试过的一种方法是在我的 DetailsList 中：

        <DetailsList
            onRenderItemColumn={this.renderItemColumn}
            ref={(list) => {this.detailsList = list;}}
            ....
        />

还有我想要关注的按钮（来自 renderItemColumn）：

                <PrimaryButton
                    onClick={() => this.handleActionSelection(fieldContent)}
                    ariaDescription={buttonText}
                    text={buttonText}
                    ref={"ButtonIWantToFocus"}
                />

在 didComponentMount() 中，我现在可以访问 DetailList，但我不知道如何让按钮 ref 获得焦点。

或者，我可以将按钮定义为：

                    <PrimaryButton
                        disabled={true}
                        ariaDescription={buttonText}
                        text={buttonText}
                        ref={(button) => {this.focusButton = button;}}
                    />

这给了我一个按钮的句柄，但它没有 focus() 功能。

谢谢你的想法。

用鼠标点击一切正常,但我想让它与键盘一起使用

当我坐在输入组件中按下键时,我希望输入没有聚焦/模糊.

这是我的输入组件

import { Input } from 'semantic-ui-react';

<Input 
  focus={this.state.inputFocus} 
  ref='search'
  placeholder='Search...' />

在进入输入时,使用按键,此代码有助于集中输入

this.refs.search.focus();
this.setState({ inputFocus: true });

但是当从输入框离开时,闪烁的键指示灯不会被移除,并且该框仍然显示为聚焦,

尝试的代码 不起作用

this.refs.search.blur(); // generates error
this.setState({ inputFocus: false }); //changes state var but ui isn't changed

模糊错误

我正在开发一个Web应用程序,我正在使用reactjs和MVC c#.

我想知道jsx是否包含在cshtml中,是否可以访问jsx中的viewbag属性？我会有一个对象或id传递给jsx,它将在UI中呈现？

我需要在几行中显示视频(卡片)的缩略图,并专注于第一个缩略图.我使用嵌套地图进行了显示.代码基本上遍历视频数组并返回多行视频.

我们如何专注于渲染的第一个元素？我想我们需要得到第一个要关注的元素的参考.但是我们如何在这里设置ref并在另一个函数中引用它？

const CategoryGrid = props => {
  return (
    <HotKeys handlers={handlers}>
      <div className="grid-container">
        <p className="title"> {props.title.toUpperCase()} </p>
        <div className="grid">
          {
            props.videos.map((rowvideos,index) => {
                var rowVideoArr = [];
                rowvideos.map((video,key)=>{
                  rowVideoArr.push(<div  key={video.id} className="fleft card-container grow">
                    <Card key={video.id} title={video.name} background={video.thumbnailUrl}/>
                  </div>)
                })
                return(<div className="row" key={index}>{rowVideoArr}</div>)
            })
          }
        </div>
      </div>
    </HotKeys>
  );
}

过滤阵列已经在这里被问了很多,但我发现的问题和答案都没有考虑到我需要的两个条件:
1.不要改变对象.
2.使用es6(ecmascript2015)及以上.
3.获取一个包含重写对象和值的新数组.

我实际上有一个答案我的问题的一部分,那就是如何过滤但感觉就像一个黑客而不是一个真正的解决方案,第二部分是如何从第二个数组获得完整的原始数组,但没有变异对象.

这是我的代码,因为你可以看到我{dirty:true}明确地分配了它而不是从它自己的数组中传递对象:

    const docPositions = [
    {
      active : false,
      dirty : false,
      key : "somekey2"
    },
    {
      active : false,
      dirty : false,
      key : "somekey1"
    },
    {
      active : false,
      dirty : false,
      key : "somekey4"
    },
    {
      active : false,
      dirty : false,
      key : "somekey3"
    }
  ]
const dirtyPositions = [
  {
      active : false,
      dirty : true,
      key : "somekey1"
  },
    {
      active : false,
      dirty : true,
      key …

我想知道是否可以添加使用反应日期选择的最大天数。基本上是已经存在的minimumNights属性的倒数。

干杯