Question

在我的组件中，当我尝试对字符串（在prop中的对象中）使用substr时，出现以下错误： Uncaught TypeError: offer.description.subtstr is not a function

在父组件中完成Axios请求时，传递道具。我检查了一下，它是一个字符串值以供说明。

这是我的完整代码：

import React, { Component } from 'react'
import {Link} from 'react-router-dom'

export class ResultBox extends Component {
    render() {
        var offer = this.props.offer;
        var info = "| " + offer.address + " | " + offer.date;
        if(offer.minimumAge > 0) {
            info = info + " | Âge minimum : " + offer.minimumAge + " ans" 
        }
        return (
            <div key={offer.id} className="result-box">
                <div className="result-box-img"><img src={require('../../img/user/hands.svg')} /></div>
                <div>
                    <span className="result-box-org">{offer.organization.name}</span>
                    <span className="result-box-title"><Link to={"/organisme/offres/" + offer.id}>{offer.name}</Link></span>
                    <p className="result-box-desc">{offer.description.subtstr(0,10)}</p>
                    {(offer.placesAvailable > 0) ? 
                    <span className="result-box-nPlaces">{offer.placesAvailable} places disponibles {info}</span>
                    :
                    <span className="result-box-nPlaces">{offer.placesAvailable * -1} personnes dans la file d'attente  {info}</span>
                    }
                </div>
                <div className="result-box-date"></div>
            </div>
        )
    }
}

ResultBox.defaultProps = {
    offer : {description: ''}
}
export default ResultBox

```

Answer 1

它是substring()

https://www.w3schools.com/jsref/jsref_substring.asp

尝试使用

offer.description.substring(0, 10)

编辑

您也可以使用substr()。

但是您的代码中有错字。您拥有的是subtstr()

Answer 2

看起来像您有错字。应该是substr而不是'subtstr'

Answer 3

您需要为此解构（substr或使用substring作为已发布的解决方案。

喜欢

    let offer = {
      description:'Hey welcome to stack overflow'
    }
    const {description} = offer;
    
    document.write(description.substr(0,10));

不能在React字符串上使用substr

3 个答案: