vue js 字符串转数组
时间: 2023-07-17 11:57:05 浏览: 92
在Vue.js中,你可以使用JavaScript的`split()`方法将字符串转换为数组。`split()`方法接受一个分隔符作为参数,并返回一个包含分割后的字符串的数组。
下面是一个示例:
```javascript
// 在Vue组件中
data() {
return {
myString: "Hello, World!",
myArray: []
}
},
methods: {
convertStringToArray() {
this.myArray = this.myString.split(", ");
}
}
// 在模板中
<button @click="convertStringToArray">转换</button>
<p>{{ myArray }}</p>
```
在上面的示例中,我们定义了一个`myString`变量来存储要转换的字符串。然后,在`convertStringToArray`方法中,我们使用`split()`方法将字符串按照逗号和空格分割成一个数组,并将结果保存在`myArray`变量中。最后,在模板中,我们使用插值表达式`{{ myArray }}`来显示转换后的数组。
当点击"转换"按钮时,字符串将被转换为数组,并在页面上显示出来。
相关问题
vue3字符串转数组
在Vue3中,将字符串转换为数组可以使用split()方法。split()方法接受一个分隔符作为参数,将字符串拆分为多个数组项,并返回一个数组。例如,如果要将字符串以逗号为界限切割为数组,可以使用以下代码:
```javascript
const str = "apple, banana, orange";
const arr = str.split(',');
console.log(arr); // ["apple", " banana", " orange"]
```
在上述代码中,我们使用split(',')方法将字符串str以逗号为分隔符切割成数组arr。
vue2 字符串转数组
可以使用Vue2中的split()方法将字符串转换为数组。下面是一个例子:
```javascript
<template>
<div>
<p>IP地址:{{ ipaddr }}</p>
<p>IP地址数组:</p>
<ul>
<li v-for="ip in ipArray" :key="ip">{{ ip }}</li>
</ul>
</div>
</template>
<script>
export default {
data() {
return {
ipaddr: '192.168.100.110',
};
},
computed: {
ipArray() {
return this.ipaddr.split('.');
},
},
};
</script>
```
在上面的代码中,我们首先定义了一个字符串类型的数据ipaddr,然后使用computed属性将其转换为数组类型的数据ipArray。在computed属性中,我们使用了split()方法将ipaddr字符串按照'.'进行拆分,得到一个包含四个ip值的数组。最后,我们使用v-for指令将数组中的每个ip值渲染到页面上。
阅读全文