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
рдШрдЯрдХреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╕рдордп рдЯреНрд░рд╛рдВрд╕рдкрд╛рдЗрд▓ рдХрд┐рдпрд╛ рдЬрд╛рдПрдЧрд╛, рд▓реЗрдХрд┐рди рдпрджрд┐ рдЖрдк рдЗрди-рдмреНрд░рд╛рдЙрдЬрд╝рд░ рд╕рдВрдХрд▓рди рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВред
рдХреНрдпрд╛ ...arguments
рдЕрднреА рднреА рд▓реЛрдЧреЛрдВ рдХреЗ рд▓рд┐рдП рдХрд╛рдо рдХрд░ рд░рд╣рд╛ рд╣реИ? рдЬрдм рдореИрдВ рдкреБрди: рдЙрддреНрд╕рд░реНрдЬрди рдФрд░ рдШрдЯрдирд╛ рдХреЗ рд▓рд┐рдП @myevent="$emit('myevent', ...arguments)"
рдЪрд▓рд╛рддрд╛ рд╣реВрдВ рддреЛ рдореБрдЭреЗ рдирд╡реАрдирддрдо vue-template-compiler рдФрд░ vue рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рдХрдВрд╕реЛрд▓ TypeError: "vm is undefined"
рдореЗрдВ рдПрдХ рддреНрд░реБрдЯрд┐ рдорд┐рд▓рддреА рд╣реИред
рдпрд╣ рдореЗрд░реЗ рдкрд╛рд░рджрд░реНрд╢реА рдХреЛрдб рдХрд╛ рд╣рд┐рд╕реНрд╕рд╛ рд╣реИ рдЬреЛ рддреНрд░реБрдЯрд┐ рдХрд╛ рд╕реНрд░реЛрдд рд╣реИ
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 рдХреЛ 5рд╡реАрдВ рдкрдВрдХреНрддрд┐ 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 ... рддрд░реНрдХреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░рддреЗ рд╕рдордп - рдХреНрдпрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдХреБрдЫ рдирдпрд╛ рдЬрд╛рджреВ рд╣реИ рдпрд╛ рдпрд╣ рд╡рд╛рд╕реНрддрд╡ рдореЗрдВ рдПрдХ рдкреНрд░рддрд┐рдЧрдорди рд╣реИ?
рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА
arguments
рдЙрдкрдпреЛрдЧ рдХрд░реЗрдВ: https://jsfiddle.net/50wL7mdz/30115/рдзреНрдпрд╛рди рджреЗрдВ рдХрд┐ рд╕реНрдкреНрд░реЗрдб рд╕рд┐рдВрдЯреИрдХреНрд╕ рдХреЛ
*.vue
рдШрдЯрдХреЛрдВ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╕рдордп рдЯреНрд░рд╛рдВрд╕рдкрд╛рдЗрд▓ рдХрд┐рдпрд╛ рдЬрд╛рдПрдЧрд╛, рд▓реЗрдХрд┐рди рдпрджрд┐ рдЖрдк рдЗрди-рдмреНрд░рд╛рдЙрдЬрд╝рд░ рд╕рдВрдХрд▓рди рдХрд╛ рдЙрдкрдпреЛрдЧ рдирд╣реАрдВ рдХрд░рддреЗ рд╣реИрдВред