Vue 스타일 구성 요소에서 입력 유형 변경[체크박스]이 작동하지 않음

Vue 스타일 구성 요소에서 입력 유형 변경[체크박스]이 작동하지 않음

이것은 Vuejs의 단순한 기능 컴포넌트입니다.

import { Label, Input, Checkmark } from "./styles";
export default {
  functional: true,
  model: {
    prop: "checked",
    event: "change"
  },
  props: {
    checked: Boolean
  },
  // eslint-disable-next-line
  render(h, { props, listeners}) {
    console.log(listeners);
    const changeHandler = listeners.change ? listeners.change : () => {};
    return (
      <Label>
        <Input
          type="checkbox"
          checked={props.checked}
          onChange={e => {
            console.log("checked", e.target.checked);
            changeHandler(e);
          }}
        />
        <Checkmark class="checkmark" />
      </Label>
    );
  }
};

컴포넌트를 다음과 같이 사용하면 console.log가 실행되지 않습니다.

<VCheckbox
     checked={this.checkSelections[idx]}
     onChange={e => {
          this.$set(this.checkSelections, idx, e.target.checked);
     }}
 />

Vuejs 사용 - 2.5.x

console.log를 실행하면listeners그들은 확실히 변화를 기록한다.

둘째, 만약 내가nativeOnChange대신, 불이 나죠

마지막으로 중요한 것은 마찬가지로 버튼 컴포넌트(기능)도 탑재되어 있기 때문에onClick(여기에서는 네이티브를 사용하지 않습니다.무슨 일인지 누가 좀 알려줄래?

업데이트 -

에서도 마찬가지다.nativeOnMouseover.

언급URL : https://stackoverflow.com/questions/53042051/onchange-input-typecheckbox-not-working-with-vue-styled-components