小编Ann*_*aSm的帖子

如何使列占据浏览器w引导4的100%高度？

请参阅以下内容:https://codepen.io/johnpickly/pen/dRqxjV

注意黄色div,我需要这个div /列占据100%的高度...有没有办法让这个发生而不必让所有父div的高度为100%？

谢谢

HTML:

<div class="container-fluid">
  <div class="row justify-content-center">

    <div class="col-4 hidden-md-down" id="yellow">
      XXXX
    </div>

    <div class="col-10 col-sm-10 col-md-10 col-lg-8 col-xl-8">
      Form Goes Here
    </div>
  </div>
</div>

我的代码在应用程序中正常工作,但是,我的eslint不喜欢它,并且说我不应该返回作业.这有什么问题？

<div ref={(el) => this.myCustomEl = el} />

我正在使用redux-form启用服务器端验证,当用户提交SignUp表单时,如果服务器响应错误,则表单显示错误...在这种情况下,错误的状态为422从服务器,并正在响应w {"errors":{"email":["has already been taken"]}}

当表单提交正常时,我无法在表单上显示SubmissionError.我在JS控制台中收到以下错误:

Unhandled rejection SubmissionError: Submit Validation Failed

我对redux-form提交验证处理有什么问题？谢谢

SignUpForm

const ensureValid = response => {
  if (response.status === 422) {
    return response.json().then(({errors}) => {
      throw new SubmissionError({
        email: 'Already in Use',
        _error: 'failed!',
      });

    });
  }
  return response;
};

class SignUp extends React.Component {

  handleSubmit(data) {
    const request = new Request('http://localhost:4400/auth/', {
     method: 'POST',
     headers: new Headers({
       'Accept'       : 'application/json',
       'Content-Type' : 'application/json',
     }),
     body: JSON.stringify({ user: data })
    });

    fetch(request).then(ensureValid).then(response => {
      return tryLogin(response, …

我正在努力在反应中创建一个 SVG 圆形进度指示器......这是我的输出：

代码笔

问题是我需要红色笔划从顶部开始，而不是当前的 90% 角度......是否可以添加一些 CSS 来重新定位红色笔划以从顶部开始？

仅供参考，我在反应中使用以下组件来呈现此 HTML：https : //github.com/wmartins/react-circular-progress/blob/gh-pages/src/js/components/CircularProgress.jsx.js

下面的codepen源

html

<svg class="CircularProgress" width="50" height="50" viewBox="0 0 50 50">
   <circle class="CircularProgress-Bg" cx="25" cy="25" r="24" stroke-width="2px"></circle>
   <circle class="CircularProgress-Fg" cx="25" cy="25" r="24" stroke-width="2px" style="stroke-dasharray: 150.796; stroke-dashoffset: 125.161;"></circle>
   <text class="CircularProgress-Text" x="25" y="25" dy=".4em" text-anchor="middle">17%</text>
</svg>

css

.CircularProgress-Bg,
.CircularProgress-Fg {
    fill: none;
}

.CircularProgress-Bg {
    stroke: #CCC;
}

.CircularProgress-Fg {
    transition: stroke-dashoffset .5s ease-in-out;
    stroke: red;
}

.CircularProgress-Text {
    font-size: 15px;
    font-weight: 600;
    fill: rgba(255,255,255,0.9);
    transform: translate(0 50%);
}

我正在构建一个注册表单，并有以下 API 调用来发布表单：

const request = new Request('http://localhost:4300/auth/', {
 method: 'POST',
 headers: new Headers({
   'Accept'       : 'application/json',
   'Content-Type' : 'application/json',
 }),
 body: JSON.stringify({ user: data })
});

fetch(request).then(response => {
    console.log(response);
    const auth = response.headers.get('Authorization');
    console.log(auth)
});

问题是response.headers.get('Authorization')作为null. 即使我查看 Chrome 的 Network XHR 请求，我也会看到 API 服务器发送的响应标头。

为什么 React 没有response.headers通过上面的请求向我提供？

谢谢

在我的react redux表单中，我具有以下内容：

        <fieldset className="form-group">
          <legend>Radio buttons</legend>
          {this.props.job_titles.map(jobTitle => (
          <div className="form-check" key={jobTitle.id}>
            <label className="form-check-label">
              <Field
                name="job_title_id"
                component="input"
                type="radio"
                value={jobTitle.id}
              />
              {' '}
              {jobTitle.title}
            </label>
          </div>
          ))}
        </fieldset>

这将正确呈现单选按钮，但是单击以选择单选按钮时，单选按钮永远不会设置为选中状态。您无法选择一个选项-表单已损坏。

什么是奇怪的是，如果我更新：value={jobTitle.id}到value="anything"那么单选按钮可以选择。

我没有在redux表单文档中看到有关动态生成的单选按钮的任何内容。我究竟做错了什么？

谢谢

我有以下几点：

return (useWordBoundary ? subString.substr(0, subString.lastIndexOf(' ')) : subString) + '\u2026';

Eslint 拒绝我的代码说：

建议使用模板文字而不是字符串连接。（首选模板）

以上有什么问题？