Vue.js 函数回调中的内容未正确显示 [英] The content not shown properly in function callback in Vue.js

查看:22
本文介绍了Vue.js 函数回调中的内容未正确显示的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有两个问题.首先是我无法正确渲染星星.如果我更改 data() 函数中的值,我可以这样做,但是如果我想以函数回调的方式进行,它不起作用(请参阅下面的评论).这里出了什么问题?和Vue的生命周期有关系吗?

第二个是我要提交star-rate和textarea的内容,当我刷新页面时,内容应该在页面上呈现并替换<textarea></textarea> 我该怎么办?

我想在这里制作一个 JSFiddle,但我不知道如何在 Vue 的单文件组件中制作它,非常感谢您的帮助.

<ul class="list-wrap"><li><span class="comment-label">rateA</span><star-rating :data="dimensionA"></star-rating><div><h4 class="title">评论</h4><textarea class="content" v-model="content"></textarea>

<mt-button type="primary" class="mt-button">提交</mt-button>

</模板><脚本>从'components/starRating'导入starRating从服务/数据服务"导入数据服务导出默认{数据 () {返回 {维度A:''//如果我改变了这里的值,星星渲染得很好.}},成分: {星级},方法: {获取评论(ID){返回 dataService.getOrderCommentList(id).then(data => {this.dimensionA = 1})}},创建(){this.getComment(1)//不工作}}

解决方案

this 的范围似乎在您的 getComment 方法中不正确,您需要进行更改,例如以下:

方法:{获取评论(ID){var self = this;dataService.getOrderCommentList(id).then(data => {self.dimensionA = 1})}},

<小时>

由于您想替换