[Vuejs]-Return a string from array

by

1👍

✅

The correct way to do this in Vue is to use a computed property to return the string:

computed: {
  displayFixturesName() {
    return this.selectedFixture.join(', ');
  }
}

Then in the template you’d have:

<p class="subtitle">{{ displayFixturesName }}</p>

I’ve removed the id (you shouldn’t need it, Vue has ref if you need to grab an element) and also the () from after displayFixturesName.

Generally you should avoid manipulating the DOM yourself, just leave Vue to do it. There are a few exceptions, such as working with third-party libraries or measuring sizes, but they are rare.

The documentation on computed properties is here:

https://v2.vuejs.org/v2/guide/computed.html#Computed-Properties

👤skirtle

0👍

Your issue is not related to VUE, but to the usage of .join().
As Jax-p pointed out in a comment already, this method does not exist on strings, only on arrays. Your .join() call will implicitly out

I’ve reduced your example to plain JavaScript to demonstrate how you could use the method.

const fixture = ["selected", "Fixture"];
console.log(fixture.join());
👤gekkedev

Leave a comment