У меня есть страница, на которой я хотел бы использовать два почти идентичных Vue приложения. У них будет простая таблица с некоторой информацией о состоянии и несколькими input с. Единственное, чем они отличаются - это идентификатор таблицы. У меня есть отдельная функция, которая передает им данные и вызывается (при обратном вызове загружаемого состояния) с приложением Vue в качестве одного из его параметров.
Так что теперь у меня есть два приложения Vue в сценарий выше друг друга и строки 48/50 идентичны (и я могу ожидать, что они будут расти). У них есть несколько data элементов, несколько methods и один computed. Как я мог избежать такого ужасного дублирования кода?
Мое решение до сих пор состоит в том, чтобы заранее определить data, computed, methods (pre_...), а затем просто:
var app1 = new Vue({
el: '#status_table_1',
data: deepcopy(pre_data),
methods: {
error: function() { return pre_methods.error(this); },
load: function(a, b, c) { return pre_methods.load(this, a, b, c); },
},
computed: {
comp_prop: function() { return pre_computed.comp_prop(this); }
}
}
, что делает его намного тоньше, но все еще много дублирования, и он просто чувствует неправильным ...
Есть идеи? Заранее спасибо!