vue.jsのcustomDirectiveで全角がbindできません
v-initで2バイト文字を渡すと、以下のエラーになりますが原因がわかりません。
半角英数字及び、objectであれば渡せます。
vue.js自体がbindでの2バイト文字を許容していないのでしょうか?
phpのblade画面からデータを取得する必要があるため、dataに初期定義することはできません。
v-init="あああ"
Vue warn]: Property or method "あああ" is not defined on the instance but referenced during render. Make sure to declare reactive data properties in the data option.
v-init="1234"(全角)
- invalid expression: v-init="1234"
customDirective.vue
Vue.directive('init', {
bind(el, bindings, vnode)
{
console.log(el.name, bindings.expression);
// v-initに渡された値をタグのnameプロパティと同一の名前のv-modelに渡す
vnode.context[el.name] = bindings.expression ? bindings.expression : '';
}
});
main.js
var app = new Vue({
el: '#main',
data: {
test: ''
}
});
html
<main id="main">
<form>
<input type="text" name="test" v-init="あああ" v-model="test">
<form>
</main>