CODEWITHSUNDEEP
javascriptreactjsdatedatepickermomentjs
rudeTool
rudeTool

Reputation: 606

not able to format and assign date in reactjs

I am working on a react app where I have to format a date in DD-MM-YYYY format and send it as a param to my api.

Here's my code:

    const params = this.props.listParams;
    const startDate = params.start_date.format('YYYY-MM-DD');
    const endDate = params.end_date.format('YYYY-MM-DD');
    params.start_date = startDate;
    params.end_date = endDate;
    console.log(startDate, endDate);

listParams structure:

const defaultListParams = {
  start_date: '',
  end_date: '',
  msg_id: '',
  page_num: 1,
  page_size: 5,
};

Here listParams has all the parameters for my api,start_date and end_Date both are moment objects inside listParams. I am formatting and assiging them to startDate and endDate variables and its working but when I reassign it back to params.start_date and params.end_date I get the following error:

index.js?bbc4:258 Uncaught TypeError: date.get is not a function
    at get$1 (index.js?bbc4:258)
    at getMonth (index.js?bbc4:366)
    at DatePicker.componentWillReceiveProps (index.js?bbc4:2450)
    at callComponentWillReceiveProps (react-dom.development.js?7f13:13389)
    at updateClassInstance (react-dom.development.js?7f13:13599)
    at updateClassComponent (react-dom.development.js?7f13:16989)
    at beginWork$1 (react-dom.development.js?7f13:18502)
    at HTMLUnknownElement.callCallback (react-dom.development.js?7f13:348)
    at Object.invokeGuardedCallbackDev (react-dom.development.js?7f13:398)
    at invokeGuardedCallback (react-dom.development.js?7f13:455)

I am not able to figure out whats the errors.Any leads will be appreaciated.

Upvotes: 0

Views: 386

Answers (3)

alpakyol
alpakyol

Reputation: 2459

Apart from assigning values to your props again, you assign string value to start_date and end_date.

format() gives you a string representation of the moment object.

From what I understand more from your error log is that you pass this string to your datepicker which wants parameters as Date or Moment objects probably.

So, if for example params.start_date is a string, then you need to construct Moment object like moment(params.start_date, 'YYYY-MM-DD'). If it is a Moment object (I assume so because you don't get any error about format()), then you don't need to use format().

Upvotes: 1

botana_dev
botana_dev

Reputation: 518

I would highly suggest you to provide some more code, because your error is date.get is not a function , but you don't provide us the date and the get method. I think it is because you're trying to call the .get on something that it can't be called on. Moreover try to console.log(date) to see what this date is (:. And comment back

Upvotes: 0

GuangWu
GuangWu

Reputation: 478

Because you attempted to change values from props which are not writable.

See this: Props are Read-Only

Upvotes: 0

Related Questions