Vueのappからバインドされていないプレーンなデータを取得する

無理
連想配列データをvue.jsでバインドした場合、どうしてもvue.jsによって余計な内部関数やプロパティが入ってしまう。それらを除いて一括でプレーンなデータを取得する方法は現状なさそう。
一つ一つ丁寧にキーをしていしてデータ取得するしかない。

ちなみに「_data」ではなく$dataが良いとのこと。

let data = vueApp.$data

追記：2022-11-11

旧・解説

連想配列データには対応できていない。



let app;

$(()=>{
	
	let formData = {
		'cat_name':'ボウシちゃん',
		'cat_nickname':'オコモさん',
	};
	
	app = new Vue({
		el: '#app1',
		data: {
			'formData':formData,
		},
	});
	
	let plainData = getPlainDataFromVue(app, 'formData');
	console.log(plainData);
	$('#res').html(JSON.stringify( plainData));
	
});

/**
* Vueのappからバインドされていないプレーンなデータを取得する
* ＠param app VueのApp
* @param key データのキー省略可
* @return {} プレーンなデータ
*/
function getPlainDataFromVue(app, key){
	let anyData = null;
	if(key==null){
		anyData = app._data;
	}else{
		anyData = app[key];
	}
	
	let plainData = {};
	for(let key2 in anyData){
		plainData[key2] = anyData[key2];
	}
	
	return plainData;
}

Vueのappからバインドされていないプレーンなデータを取得する | ワクガンス

Demo