Что this.myClick () делает в этом методе vue js и как я могу это проверить?

Question

В настоящее время в коде Vue у меня есть страница, которая имеет следующую строку:

<MyButton :my-click="generateSomeValues"/>

generateSomeValues, генерирует значения, которые затем устанавливаются на опору в компоненте.

MyButton является компонентом, и внутри него есть следующее:

    @click.prevent="myloginButtonClicked" (The button has a click event which called the code below)

У нас есть реквизит и методы:

      props: {
         myClick: {
           type: Function,
           default: undefined,
    },
  },

      methods: {
        async myloginButtonClicked() {
          if (typeof this.myClick !== 'undefined') {
            this.myClick();
          }
        }
      },

Я пытаюсь понять, что делает this.myClick () и как это можно проверить с помощью Jest. Глядя на это, я бы подумал, что myClick - это просто опора, а не метод?

Answer 1

На основе фрагмента кода

props: {
    myClick: {
        type: Function,
        default: undefined,
    }
},

Вы действительно определили myClick как опору.Это не метод.Это, однако, опора, которая оказывается функцией, что означает, что ее можно вызывать.

Чтобы проверить ее, вы можете использовать функцию Mock

const mockMyClick = jest.fn(() => {});
const wrapper = shallowMount(MyButton, {
  propsData: { myClick: mockMyClick }
});
const button = wrapper.find('button') // or whatever
button.trigger('click')
expect(mockMyClick.mock.calls.length).toBe(1);