Vue: <select>ब्याह के बाद सरणी गलत तरीके से करता है ()</select>

को निर्मित 30 सित॰ 2016 · 6टिप्पणियाँ · स्रोत: vuejs/vue

निम्नलिखित कोड पर विचार करें:

<div id="demo">
  <select v-model="selected" number>
    <option v-for="opt in options" :value="$index" number>{{opt}}</option>
  </select>
</div>

<select> , प्रत्येक विकल्प मूल्य $index साथ बाध्य है। यदि हम splice() options , जैसे, options.splice(0,1) , $index विकल्पों के साथ सही ढंग से सिंक नहीं करते हैं।

उदाहरण के लिए, options=['a','b'] और प्रदान किया गया HTML जैसा दिखता है (लेकिन वास्तव में नहीं):

<div id="demo">
  <select selectedIndex="0">
    <option value="0">a</option>
    <option value="1">b</option>
  </select>
</div>

options.splice(0,1) के बाद, फिर options=['b'] , लेकिन प्रदान किया गया HTML बन जाता है:

<div id="demo">
  <select selectedIndex="0">
    <option value="1">b</option>
  </select>
</div>

'बी' विकल्प का मूल्य 1 नहीं बनता है, जो $index कारण 0 होना चाहिए। यह एक बग नहीं हो सकता है, लेकिन यह एक तरह का है।

नीचे इस मुद्दे का लाइव डेमो है:
https://jsfiddle.net/peteranny/trwp98g9/4/

bug

स्रोत

peteranny

सबसे उपयोगी टिप्पणी

2.0 पर परीक्षण किया गया और यह उम्मीद के मुताबिक काम किया: https://jsfiddle.net/dycmgzcm/
इसलिए मैं इसे 1.x के बग के रूप में चिह्नित कर रहा हूं

fnlctrl 2 अक्तू॰ 2016

👍2

सभी 6 टिप्पणियाँ

बस अपने टेम्पलेट selected="{{$index == selected}}" में एक चयनित विशेषता जोड़ें

मैं यहां डेमो अपडेट करता हूं https://jsfiddle.net/trwp98g9/5/

defcc 1 अक्तू॰ 2016

👍1

@peteranny क्या आप स्पष्ट कर सकते हैं कि अपेक्षित व्यवहार क्या था?

Options.splice (0,1) के बाद, फिर विकल्प = ['b'], लेकिन प्रदान किया गया HTML बन जाता है:
<option value="1">b</option>

जैसा कि आप यहाँ से प्रदान करते हैं वैसा ही परिणाम मुझे नहीं मिल रहा है:
हटाने से पहले क्लिक करें:
before

क्लिक करने के बाद:
after

'बी' विकल्प का मूल्य 1 नहीं बनता है, जो $ सूचकांक के कारण 0 होना चाहिए

तो वास्तव में क्या बनना चाहिए? 'B' का मान क्लिक करने से पहले 1 था, और क्लिक के बाद 0 हो गया।

fnlctrl 1 अक्तू॰ 2016

@fnlctrl उम, आपके परीक्षण के लिए धन्यवाद। मुझे लगता है कि मैंने गलत सवाल पूछा है।
आपके परीक्षण के अनुसार, 'b' का मान क्लिक करने के बाद 0 हो गया।

मेरा सच्चा सवाल यह है कि अब 'बी' का मूल्य 0 था, वैसे भी <select> चयन क्यों नहीं किया गया?
जैसा कि आपकी छवि में देखा गया है, <select> ने किसी भी विकल्प का चयन नहीं किया, जबकि <select> का मूल्य 0 के साथ विकल्प का चयन करना चाहिए।
(और इसीलिए मैंने गुमराह किया कि 'b' का मान नहीं बदला।)

peteranny 2 अक्तू॰ 2016

@peteranny यह एक बग हो सकता है क्योंकि selected 0 बने रहे जबकि options बदल गए, और डोम को इस परिवर्तन को प्रतिबिंबित करना चाहिए, लेकिन मुझे यकीन नहीं है ..

अभी के लिए, आप @defcc के अनुसार selected प्रोप जोड़ने का प्रयास कर सकते हैं, (ध्यान दें कि प्रॉप्स / अटार्स के लिए मूंछें चित्रित किया गया है, इसलिए कृपया :selected="$index == selected" उपयोग करें)
या आप track-by प्रोप को <options> जोड़ सकते हैं, जिसने संभवत: यह समझा कि डोम में चयनित मूल्य को अपडेट करना सुरक्षित है। https://jsfiddle.net/74ncq90w/

fnlctrl 2 अक्तू॰ 2016

👍2

fnlctrl 2 अक्तू॰ 2016

👍2

1.x मुद्दों को 1.x के रूप में बंद करना अब जीवन का अंत है और केवल महत्वपूर्ण सुरक्षा पैच प्राप्त करेगा।

yyx990803 17 अप्रैल 2018

क्या यह पृष्ठ उपयोगी था?

0 / 5 - 0 रेटिंग्स

Vue: <select>ब्याह के बाद सरणी गलत तरीके से करता है ()</select>

सबसे उपयोगी टिप्पणी

सभी 6 टिप्पणियाँ

संबंधित मुद्दों