TypeError: Cannot read property 'replace' of undefined in the context of VueJS

Question

I am filtering some of the characters from the string. I went across few questions which has a same problem ie error in the console, but could not find any good answers.

Here is my string:

response_out1|response_out2|response_out3

Here is the method that i have used:

<vs-select v-model="change">
    <vs-select-item  :key="index" v-bind="item" v-for="(item,index) in 
        userFriendly(out.changes)" />
</vs-select>  

... 

methods: {
        userFriendly (str){
            return str.replace(/_/g, ' ').split('|').map(value => ({text: value, value }))
}

Here is the output that i am getting in the vs-select:

response out1
response out2
response out3

The error that i am getting in my console:

Here i want to know why i am getting this error and i wanna know how to rectify it and the output that i am expecting is: Response Out1, here how to capitalize first character of each word in the same method.

Nik.Developer · Accepted Answer · 2021-01-25 13:33:08Z

1

you're using a method directly in the template which causes multiple calls whenever your data changes, you can use computed property to avoid such a scenario, not sure about how you are accessing out.changes

this might help you to solve your error and capitalize your text,

capitalize(str) {
    return str.charAt(0).toUpperCase() + str.slice(1);
},
sentenceCase (sentence) {
    return sentence.split(' ').map(s => this.capitalize(s)).join(' '));
},
userFriendly (str) {
    if (!str) return;
    return str.replace(/_/g, ' ').split('|').map(value => ({text: this.sentenceCase(value), value }))
},

edited Jan 25, 2021 at 13:33

answered Jan 25, 2021 at 13:03

Nik.Developer

1319 bronze badges

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

Collectives™ on Stack Overflow

TypeError: Cannot read property 'replace' of undefined in the context of VueJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related