Vue: يفقد $ emit مع وسيطات متعددة البيانات باستخدام مستمع مضمن يستخدم الحدث $

تم إنشاؤها على ٢٦ أبريل ٢٠١٧  ·  3تعليقات  ·  مصدر: vuejs/vue

الإصدار

2.2.6

رابط الاستنساخ

https://jsfiddle.net/psycketom/50wL7mdz/29927/

خطوات التكاثر

  • يصدر المكون مع وسائط متعددة للحمولة: $emit('event', first, second, arbitrary) ، حسب الوثائق .
  • ولي الأمر يستمع إلى الحدث عبر الكشف المضمّن @event="listener($event)" .
  • لاحظ كيف لا يحصل المستمع على الحمولة الكاملة ، ولكن القيمة الأولى فقط.

ما هو متوقع؟

حمولة الحدث الكاملة ، إما كمصفوفة أو بوسائل أخرى.

ما الذي يحدث بالفعل؟

يتم تمرير القيمة الأولى فقط.


واجهت هذا من خلال إنشاء قائمة بالمكونات باستخدام v-for ، والاستماع إلى حدث واضطررت إلى تمرير المعلمة index إلى المستمع: @event="listener(index, $event) .

ربما كان من المفترض أن يتم حل حالة الاستخدام الخاصة بي بشكل مختلف (سمة البيانات المربوطة؟!) ، إذا كان الأمر كذلك ، فلن أمانع في الحصول على بعض الإرشادات.

التعليق الأكثر فائدة

استخدم arguments : https://jsfiddle.net/50wL7mdz/30115/

لاحظ أنه سيتم نقل صيغة الانتشار عند استخدام مكونات *.vue ، ولكن ليس إذا كنت تستخدم الترجمة في المتصفح.

ال 3 كومينتر

استخدم arguments : https://jsfiddle.net/50wL7mdz/30115/

لاحظ أنه سيتم نقل صيغة الانتشار عند استخدام مكونات *.vue ، ولكن ليس إذا كنت تستخدم الترجمة في المتصفح.

هل لا يزال ...arguments يعمل مع الأشخاص؟ عندما أقوم بتشغيل @myevent="$emit('myevent', ...arguments)" لإعادة الإرسال والحدث ، يظهر لي خطأ في وحدة التحكم TypeError: "vm is undefined" باستخدام أحدث برنامج التحويل البرمجي vue-template-compiler و vue.

هذا هو الجزء من الكود الذي تم تحويله والذي يمثل مصدر الخطأ

            on: {
              myevent: function($event) {
                var i = arguments.length,
                  argsArray = Array(i)
                while (i--) argsArray[i] = arguments[i]
                return _vm.$emit.apply(
                  void 0,
                  ["myevent"].concat(argsArray)
                )
              }
            }

وهذا جزء من كود Vue الذي يلقي في الواقع الخطأ TypeError في السطر الخامس vm._events[lowerCaseEvent] . أعتقد أنه بسبب void 0 أعلاه تعيين undefined إلى القيمة vm أدناه. أي فكرة من أين تأتي المشكلة؟

Vue.prototype.$emit = function (event) {
    var vm = this;
    if (process.env.NODE_ENV !== 'production') {
      var lowerCaseEvent = event.toLowerCase();
      if (lowerCaseEvent !== event && vm._events[lowerCaseEvent]) {
        tip(
          "Event \"" + lowerCaseEvent + "\" is emitted in component " +
          (formatComponentName(vm)) + " but the handler is registered for \"" + event + "\". " +
          "Note that HTML attributes are case-insensitive and you cannot use " +
          "v-on to listen to camelCase events when using in-DOM templates. " +
          "You should probably use \"" + (hyphenate(event)) + "\" instead of \"" + event + "\"."
        );
      }
    }
    var cbs = vm._events[event];
    if (cbs) {
      cbs = cbs.length > 1 ? toArray(cbs) : cbs;
      var args = toArray(arguments, 1);
      var info = "event handler for \"" + event + "\"";
      for (var i = 0, l = cbs.length; i < l; i++) {
        invokeWithErrorHandling(cbs[i], vm, args, vm, info);
      }
    }
    return vm
  };

@ yyx990803 أرى نفس الخطأ rightaway عند محاولة استخدام الحجج - هل هناك سحر جديد لاستخدامه أم أن هذا بالفعل انحدار؟

هل كانت هذه الصفحة مفيدة؟
0 / 5 - 0 التقييمات