image

How to Convert String Into Array in VueJS Tutorial

In this tutorial you can easily follow the steps to convert string into array in Vuejs. Not just that we have shown example and have split data and converted strings into arrays so that they are easy to follow.

We have converted strings into arrays in this Vuejs tutorial having multiple select box options. We know in JavaScript the split() method is used for splitting string into an array of the sub-string that returns us a new collection of array. See this example here:

myArray.split(separator);

You can see here how the returned data from our back-end appear. Now we have to split it.

tags: "tag1,tag2,tag3"

Here is the code example

<script>
    export default {
        data() {
            return {
                form: {
                    seoTags: []
                },
            }
        }
        mounted() {
            this.fetchTags();
        },
        methods: {
            fetchTags() {
                axios
                .get('/api')
                .then(response => {
                    this.form.seoTags = response.data.data.seo.tags.split(",")
                })
                .catch(function (error) {
                    console.log('errors: ', error);
                });
            },
        }
    }
</script>

In the above seo example you will notice we splitted seo ‘tags’ using a comma (,) so now we get array for each of them. In the result we get each SEO tag separated.