使用NPM安装模具组件,其方法不能直接用于反应。 js和vue。 js

时间:2019-05-13 14:23:40

标签: reactjs vue.js npm-install stenciljs react-wrapper

我想在reacting.js和vue.js中使用模具组件方法,但是我不能使用此方法。该方法是使用stencil.js中的@METHOD创建的。我的代码如下:

IN REACT.JS

<li-rating ref={this.liRatingFontAwesome}></li-rating>

liRatingFontAwesome = React.createRef();
var liRating = this.refs.liRatingFontAwesome;
liRating.setSvgString();       <= Thit method can't find.

IN VUE.JS

<li-rating id="liRatingFontAwesome"></li-rating>

var liRating = document.getElementById("liRatingFontAwesome");
liRating.setSvgString();        <= Thit method can't find.




vue.esm.js?efeb:1897 TypeError: liRating.setSvgString is not a function
at VueComponent.mounted (RateDemo.vue?30fb:150)
at invokeWithErrorHandling (vue.esm.js?efeb:1863)
at callHook (vue.esm.js?efeb:4222)
at Object.insert (vue.esm.js?efeb:3148)
at invokeInsertHook (vue.esm.js?efeb:6351)
at Vue.patch [as __patch__] (vue.esm.js?efeb:6570)
at Vue._update (vue.esm.js?efeb:3948)
at Vue.updateComponent (vue.esm.js?efeb:4069)
at Watcher.get (vue.esm.js?efeb:4482)
at new Watcher (vue.esm.js?efeb:4471)

1 个答案:

答案 0 :(得分:1)

这可能是时间问题。即使存在DOM元素,Stencil可能尚未完成组件的加载,因此该方法可能尚未在原型中存在。作为测试,请尝试从setTimeout()中调用该方法,例如:

 @Bean
 public ResourceProcessor<Resource<Person>> personProcessor() {
    return new ResourceProcessor<Resource<Person>>() {
      @Override
      public Resource<Person> process(Resource<Person> resource) {
       resource.add(new Link("http://localhost:8080/people", "added-link"));
       return resource;
      }
    };
 }