小编pra*_*esh的帖子

代码如下

<input type="number" class="form-control" value="" name="cost_price" #name="ngModel" [(ngModel)]="item.cost_price" placeholder="Cost Price"  />

用户不应该输入更多2位小数.

例如,如果用户想要输入21.256.他应该只被允许进入21.25

如何使用角度5来实现这一点？

我在我的项目中使用材质 ui 按钮。最初，添加按钮只有+ 图标。

当鼠标悬停时，我需要将按钮的内容从图标更改为文本“CREATE ITEM”

代码如下。

import Fab from '@material-ui/core/Fab';
import AddIcon from '@material-ui/icons/Add';
import { makeStyles } from '@material-ui/core/styles';
const useStyles = makeStyles(theme => ({
  iconHover: {
    '&:hover': {
      border: '2px solid green',
      //TODO display the text CREATE ITEM instead of AddIcon
    }
  },

  floatBtn: {
    marginRight: theme.spacing(1),
  },
}));



const Index = () => {
  const classes = useStyles();
  return(
  <div className={classes.floatBtn}>
    <Fab size="small" color="secondary" aria-label="add" className={classes.iconHover}>
          <AddIcon />
        </Fab>
  </div>
)};

关于如何实现这一目标有什么想法吗？

我需要检查多个参数的存在.目前我写的是

if params[:p1].present? && params[:p2].present? && params[:p3].present?
  # Do something
end

有没有更有效的方法来做到这一点？

我需要在 react quill HTML 编辑器中添加一个自定义工具栏按钮。

我已经按照教程https://github.com/zenoamaro/react-quill#custom-toolbar但无法让它工作。代码如下。

import React, {Component} from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';

import ReactQuill from 'react-quill'; // ES6

import './style.scss';

class DocumentForm extends Component {

  constructor(props) {
    super(props);

    this.state = {
      file: null,
      documentDetails: {},
      text: ''
    };
    this.handleEditorChange = this.handleEditorChange.bind(this);
    this.modules =  {
      toolbar: [
        [{ 'header': [1, 2, false] }],
        ['bold', 'italic', 'underline','strike', 'blockquote'],
        [{'list': 'ordered'}, {'list': 'bullet'}, {'indent': '-1'}, {'indent': '+1'}],
        ['link', 'image'],
        ['clean']
      ],
    } …

我已经构建了一个 reactJS 应用程序 npx create-react-app。

目前我已经退出了该应用程序，因为我需要使用 copy webpack 插件。为此，我需要访问配置文件。

问题是，

• 弹出应用程序是一个好习惯吗？
• 会不会因此有任何问题？
• 你在什么情况下运行“npm run eject”

我正在学习redux钩子，想知道如何将其与redux saga一起使用。

目前，用传奇编写的代码如下。

centres.js

componentDidMount() {
    this.props.getCenters();
  }

...

<tbody>
                            {
                              this.props.centers ?
                                <React.Fragment>
                                  {
                                    centers.map((center, index) =>
                                      <tr key={index}>
                                        <td>{center.name}</td>
                                        <td>{center.zip}</td>
                                      </tr>
                                    )
                                  }
                                </React.Fragment>
                              :
                                <tr>
                                  <td> No data available</td>
                                </tr>

                            }
                          </tbody>

动作文件定义如下。

export const getCenters = () => ({
  type: types.CENTERS_REQUEST,
});

saga文件的定义如下。

import { DEFAULT_ERROR_MSG } from '../../constants';
import { instance as centerProvider } from '../services/centerProvider';

function* fetchCenters() {
  try {
    const response = yield call(centerProvider.getCenters);
    const centers = response.data.data.centers;

    // dispatch a success action …

我的模型中有一个与数据库中的列对应的枚举.

枚举看起来像:

enum efficency: { High: 0, Medium: 1, Low: 2 }

如何从值中获取密钥

例如,我的值为0,我需要获取值High.

任何帮助,将不胜感激.

我是 reactjs 的新手并试图学习传奇。

我已经构建了一个根 saga 文件，如下所示。

import { all } from 'redux-saga/effects';

import { watchBookFetchRequest } from './bookSaga'
import { watchAuthRequest, watchIsLoggedInRequest, watchLogoutRequest } from './authSaga'

export default function* rootSaga() {
   yield all([
    watchAuthRequest(),
    watchBookFetchRequest(),
    watchIsLoggedInRequest(),
    watchLogoutRequest()
   ]);
}

对于每个模块，我都创建了一个单独的 saga 文件并将所有这些相关操作放在该文件中。

最后，我采取了所有这些行动，并将它们结合到 root saga 中。

我假设，当项目变得更大更复杂并且有很多模块时，所有的观察者都会像上面的代码一样以同样的方式添加

export default function* rootSaga() {
   yield all([
    watchRequest1(),
    watchRequest2()
    .
    .
    .
    watchRequestn()
   ]);
}

也就是说，root saga 将包含相当多的观察者 - 登录、仪表板、书籍、帐户等的观察者。

这是这样做的正确方法吗？

我有一个包含几个问题的表格。一些问题有一组子问题。这些是使用以下代码呈现的。

    {
  Object.keys(this.props.moduleDetails.questions).map((questionInfo, index) => (
    <div key={index}>
      <QuestionAnswers
        questionInfo={this.props.moduleDetails.questions[questionInfo]}
        generateStepData={this.props.generateStepData}
        states={this.props.states}
        userEnteredValues={this.props.formValues}
        errors={this.props.errors}
        setQuestionAnswers={this.setQuestionAnswers}
      />
      {this.props.moduleDetails.questions[questionInfo].question_group &&
      this.props.moduleDetails.questions[questionInfo].has_grouped_questions ===
        1 ? (
        <div className="sub-questions">
          {this.props.moduleDetails.questions[questionInfo].question_group ? (
            <span>
              {this.renderQuestionGroup(questionInfo)}
              <input
                type="button"
                onClick={e => {
                  this.addQuestionGroup(questionInfo)
                }}
                value="Add"
                className="btn"
              />
            </span>
          ) : null}
        </div>
      ) : null}
    </div>
  ))
}

如您所见，问题组是使用 renderQuestionGroup(questionInfo) 方法呈现的。

renderQuestionGroup(questionInfo) {
    let input = [];
    this.state.groupedQuestions[questionInfo] = (this.state.groupedQuestions[questionInfo]) ?
                    this.state.groupedQuestions[questionInfo]
                    : [];
    let answerId = this.props.formValues[questionInfo];
    let groupedQuestions = this.props.moduleDetails.questions[questionInfo].question_group[answerId];
    if((groupedQuestions != null && this.state.groupedQuestions[questionInfo].length …

我在我的项目中使用 google-maps-react。

现在我需要在地图中集成地方 api。

但似乎存在一些加载顺序问题，因此我收到以下错误。

错误：[react-places-autocomplete]：必须加载 Google Maps JavaScript API 库。请参阅：https : //github.com/kenny-hibino/react-places-autocomplete#load-google-library

如果我删除了地点组件，地图工作正常。

我需要两个组件一起工作。

关于如何解决这个问题的任何想法？