Solusi perulangan v-for VueJS

 <div class="container">
	<div class="number" v-for="num in no"
						v-on:mousedown="pressDown"
						v-on:mouseup="pressUp"
						v-bind:data-value="num.no">
		<div class="no">{{num.no}}</div>
		<div class="let">{{num.text.join(' ')}}</div>
	</div>
	<h2>{{output}}</h2>
</div>
var app = new Vue({
	el: '.container',
	data: {
		no: [
			{'no': '1', 'text': ['.', ',', '?']},
			{'no': '2', 'text': ['a', 'b', 'c']},
			{'no': '3', 'text': ['d', 'e', 'f']},
			{'no': '4', 'text': ['g', 'h', 'i']},
			{'no': '5', 'text': ['j', 'k', 'l']},
			{'no': '6', 'text': ['m', 'n', 'o']},
			{'no': '7', 'text': ['p', 'q', 'r', 's']},
			{'no': '8', 'text': ['t', 'u', 'v']},
			{'no': '9', 'text': ['w', 'x', 'y', 'z']},
			{'no': false, "text": '*'},
			{'no': '0', 'text': '|___|'},
			{'no': false, "text": '#'}
		],

pertanyaannya kenapa pas jalanin metode join(' ') nya selalu error? padahal isinya array.

tapi dikasus ke 2 malah g ada masalah pas ngelakuin metode join

 <div class="container">
	<div class="number" v-for="num in no"
						v-on:mousedown="pressDown"
						v-on:mouseup="pressUp"
						v-bind:data-value="num.no">
		<div class="no">{{num[0]}}</div>
		<div class="let">{{num[1].join(' ')}}</div>
	</div>
	<h2>{{output}}</h2>
</div>
no: [
['1', ['.', ',', '?']],
['2', ['a', 'b', 'c']],
['3', ['d', 'e', 'f']],
['4', ['g', 'h', 'i']],
['5', ['j', 'k', 'l']],
['6', ['m', 'n', 'o']],
['7', ['p', 'q', 'r', 's']],
['8', ['t', 'u', 'v']],
['9', ['w', 'x', 'y', 'z']],
['*', [false]],
['0', [' ']],
['#', [false]]
]

di kasus pertama pas di reload browsernya selain error g tampil apa2 malah hang jg, jd lemot g bisa di close tab nya