I even receive the expected result, so why does it throw this error?
Because at some stage, it is undefined
. Clearly, if you're ultimately getting the result you expect, it's then becoming defined, but that's later.
You could work around it by doing:
v-for="line in (message.message || "").split('\n')"
...but it would probably be better to look at the greater picture of what that code's doing and find out why message.message
is undefined
at times it's trying to evaluate that.
As Bill Criswell points out in a comment, you might look at using a computed property on your model for that rather than an in-template expression. E.g.:
var vm = new Vue({
// ...your other stuff here...
// Computed properties:
computed: {
messageLines: function() {
return (this.message.message || "").split("\n");
}
}
});
then
v-for="line in messageLines"