使用Vue.js和WebComponents類似紙元素聚合物

我正在製作一個Web應用程序（服務器呈現，而不是SPA），但有一些客戶端funcionality，這樣的隱藏元素，當其他元素有一些價值時，使HTTP調用或驗證一些輸入字段。使用Vue.js和WebComponents類似紙元素聚合物

現在，我正在使用WebComponents（紙元素和其他）來製作UI和Vanilla JavaScript（帶有一些Polyfills，如WebComponents.js或fetch.js）來執行此功能。

但是，到目前爲止，我已經意識到，我有許多JavaScript行可以通過像Vue這樣的框架來減少（甚至刪除）任何事情（如隱藏輸入字段，如果條件不滿足）。 js並用指令表達HTML。

我的問題是，當我嘗試使用Vue.js紙元素或其他元素，Vue.js指令一樣v-model不工作（即使紙張元素值屬性是value像標準的HTML元素）。

我嘗試使用:value代替v-model，而這個工作，但只能與一個雙向數據綁定（這是正常的v-bind），但我需要雙向數據在paper-elements約束力，v-model不起作用。

一個想法可以是，當使用一個冒號（的v-bind簡寫），以指示一個雙向數據綁定，（例如:disabled="someCondition"），使用兩個冒號來指示雙向數據中的任何屬性（在一些WebComponents結合，可能是有用的在value以外的其他HTML屬性中執行此操作（例如::value）。

有人知道與像Vue.js expresive HTML任何框架那農具數據綁定（在任何HTML屬性雙向），並基本控制結構（如v-if和v-repeat），或做兩個方面的數據與Vue公司的任何HTML屬性綁定.js（o更簡單，使用紙元素做v模型工作）。

我不知道製作Vue.js的WebComponents特性，因爲我使用Polymer來做這件事。

謝謝你！

來源

2017-04-14 Ivan Montilla

與VueJs你可以做 :value="value" @input="value = $event.target.value"

，而不是v-model="value"

來源

2017-05-20 20:36:37 mchikhaoui

我可以只綁定一個指令嗎？ –

v模型只是語法糖：''但它僅適用於輸入，if你不會爲你的自定義組件創建你自己的V模型，請按照下列步驟操作：https：//vuejs.org/v2/guide/components.html#Form-Input-Components-using-Custom-Events – mchikhaoui

好的...可以我使用'：value.prop =「x」@ input =「x = $ event.target.x」'？我需要對'postalCode'或'city'等其他屬性進行相同操作，因爲我使用的組件具有多個輸入（地址輸入）。有屬性，沒有HTML屬性。 –

是的，它是可能的奧裏利亞做到這一點：

<input value.two-way="variable">

來源

2017-05-20 16:59:11 mchikhaoui

是奧裏利亞認爲是虛擬機庫，而不是一個完整的框架像Angular？我的應用程序主要是服務器渲染的，但我需要像Vue這樣的虛擬機庫。 –

使用Vue.js和WebComponents類似紙元素聚合物

回答

相關問題