Lodash ReferenceError: _는 Vue에서는 정의되어 있지 않습니다.다른 곳에서도 동작합니다.

Lodash ReferenceError: _는 Vue에서는 정의되어 있지 않습니다.다른 곳에서도 동작합니다.

컴포넌트 shoppingCart.vue 파일에서 간단한 메서드를 호출합니다.

saveCart : _.debounce(() => {
            console.log('hi');
        }, 2000),

하지만 다음 오류가 나타납니다.Uncaughed ReferenceError: _가 정의되어 있지 않습니다.

이제 재밌는 부분이 생겼군예를 들어 기능을 다음과 같이 변경하는 경우:

saveCart(){
   console.log(_.random(0, 5));
}

모든 것이 완벽하게 작동하며 나는 예를 들어 4를 얻는다.한층 더 흥미를 끌기 위해서, _.debounce 를 사용하고 있는 다른 컴포넌트가 있습니다(예: Users 검색).

findUsers: _.debounce(
     function (term) 
     {
        let vm = this;
        axios.get('/search', { params: { user: term }})
            .then(response => {
                vm.updateResult(response.data);
            });
    }
  ,500),

그리고 그것은 완벽하게 작동한다.

여기 배경 정보가 몇 가지 있습니다.어디가 문제인지 알 것 같은데 잘 모르겠어요.저는 Laravel을 사용하고 있으며 Lodash를 bootstrap.js를 통해 Import하고 있습니다.

window._ = require('lodash');

나의 컴포넌트 shoppingCart.vue가 Buying에서 호출되고 있습니다.vue. 구매 중.vue는 에 의해 호출됩니다.

export default new VueRouter({
   mode: 'history',
   routes: [
      {
        path: '/:user/:title',
        component: require('./views/buying/Buying'),
      },
   ],
});

혹시 vue 라우터 때문에 문제가 생긴 건 아닐까요?하지만 저는 jsfiddle http://jsfiddle.net/gnu5gq3k/,을 만들려고 했지만, 이 경우 제 예가 효과가 있습니다.내 실생활 프로젝트 test2는 문제를 일으킨다...

뭐가 문제죠?제 문제를 더 잘 이해하려면 어떤 정보가 필요합니까?

편집 볼 수 없는 쉬운 실수를 하고 있는 것 같습니다.코드를 다음과 같이 변경했습니다.

debounce(func, wait, immediate) {

        var timeout;
        return function() {
            var context = this, args = arguments;
            var later = function() {
                timeout = null;
                if (!immediate) func.apply(context, args);
            };
            var callNow = immediate && !timeout;
            clearTimeout(timeout);
            timeout = setTimeout(later, wait);
            if (callNow) func.apply(context, args);
        };
    },
    saveCart: this.debounce(() => {
                // All the taxing stuff you do
                console.log('blubb');
            }, 250),

그리고 난 내 기능을 부를 수 없어!

Uncaught TypeError: this.debounce is not a function
at Object

내가 뭘 잘못하고 있지?

오류: Uncaughed ReferenceError: _가 정의되지 않았습니다.

인shoppingCart.vue하다import _ from 'lodash';:

<script>
  import _ from 'lodash';

  export default {
     // ...
  }
</script>

Uncaughed TypeError: this.debounce는 객체의 함수가 아닙니다.

사용할 수 없습니다.this개체를 구성하는 동안(개체는 아직 생성되지 않음).그 코드는 바로 실행되지 않기 때문에 기능에서 사용할 수 있습니다.

window.a = "I'm window's a";
var myObj = {
  a: 1,
  b: this.a
};
console.log(myObj); // {a: 1, b: "I'm window's a"}

해결 방법은 다음과 같습니다.

mounted(){
  let that = this;
  let savingCart = _.debounce(() => {
     that.saveCart();
  }, 1000);

  window.events.$on('savingCart', savingCart);
}

이 정도면 잘 동작합니다.

언급URL : https://stackoverflow.com/questions/49088526/lodash-referenceerror-is-not-defined-in-vue-even-though-it-works-everywhere-e