0

I have JSON that looks like this:

[
{
    "invoice": {
        "index": 1.0,
        "id": "58107",
        "read": "1"
    }
},
{
    "invoice": {
        "index": 2.0,
        "id": "58105",
        "read": "0"
    }
},
{
    "ResultCount": 532.0
},
{
    "Search": 0.0
}
]

JSON called by fetch request:

class App extends React.Component {
constructor(props) {
    super(props);
    this.state = {
        data: [],
        library: null,
        perPage: 20,
        currentPage: 1,
        maxPage: null,
    };
}
componentDidMount() {
    fetch('/json.bc', {
        method: 'get',
    })
        .then(response => response.text())
        .then(text => {
            let Maindata = JSON.parse(text)
            this.setState(state => ({
                ...state,
                data: Maindata
            }), () => {
                this.reorganiseLibrary()
            })
        }).catch(error => console.error(error))
}

reorganiseLibrary = () => {
    const { perPage, data } = this.state;
    let library = data;
    library = _.chunk(library, perPage);
    this.setState({
        library,
        currentPage: 1,
        maxPage: library.length === 0 ? 1 : library.length
    })
}

previousPage = event => {
    this.setState({
        currentPage: this.state.currentPage - 1
    })
}

nextPage = event => {
    this.setState({
        currentPage: this.state.currentPage + 1
    })
}

handlePerPage = (evt) =>
    this.setState({
        perPage: evt.target.value
    }, () => this.reorganiseLibrary());

renderLibrary = () => {
    const { library, currentPage } = this.state;
    if (!library || (library && library.length === 0)) {
        return <div>nodate</div>
    }
    return library[currentPage - 1].map((item, i) => (
        <tr>
            <td>{item.invoice.index}</td>
        </tr>
    ))
}


render() {
    const { library, currentPage, perPage, maxPage } = this.state;
    return (
        <div>
            {this.renderLibrary()}
            <ul id="page-numbers">
                <li className="nexprevPage">
                    {currentPage !== 1 && (
                        <button onClick={this.previousPage}><span className="fa-backward"></span></button>
                    )}
                </li>
                <li className="controlsPage active">{this.state.currentPage}</li>
                <li className="restControls">...</li>
                <li className="controlsPage">{this.state.maxPage}</li>
                <li className="nexprevPage">
                    {(currentPage < maxPage) && (<button onClick={this.nextPage}><span className="fa-forward"></span></button>
                    )}
                </li>
            </ul>
        </div>
    )
}
}
ReactDOM.render(<App />, document.getElementById('ResultContainer'))

I want to remove two last object of JSON :

{
"ResultCount": 532.0
},
{
"Search": 0.0
}

How can I remove them?

1
  • are use lodash package Commented Aug 25, 2019 at 11:31

2 Answers 2

1

You can use splice method

data.splice(data.length-2, 2);

let data = [
{
    "invoice": {
        "index": 1.0,
        "id": "58107",
        "read": "1"
    }
},
{
    "invoice": {
        "index": 2.0,
        "id": "58105",
        "read": "0"
    }
},
{
    "ResultCount": 532.0
},
{
    "Search": 0.0
}
];
data.splice(data.length-2, 2);
console.log(data)

Sign up to request clarification or add additional context in comments.

1 Comment

on side note:- data.splice(-2) will do the same, and data.slice(0,data.length-2) can also be used which will not mutate the original object
0

you can use delete Maindata.ResultCount. This one won't throw errors or will behave unexpectedly in case of data structure changes

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.