Question

我正在使用Laravel并希望创建一个简单的编辑应用程序来编辑帖子。我正在使用Vue.js 2绑定数据，但不知何故它不会显示它 - 我不确定可能出错的地方。当我使用Vue（例如@{{ postData.title }}）显示数据时，它会在页面上显示标题。但我想在输入中显示数据，以便进行编辑。路由和一切都很好，因为我得到了正确的URL，我可以在Vue中显示数据，而不是在文本框中。提前谢谢。

这是我的HTML：

 <div id="postEdit">
  <div class="container">
    <div class="row">
      <form class="form-horizontal" method="POST">
        <meta id="_token" content="{{ csrf_token() }}">
          <h1>Edit your post</h1>
        <div class="form-group">
          <label for="title">Title</label>
           @{{ postData.title }}
          <input type="text" name="title" id="title" class="form-control" v-model="postData.title">
        </div>
        <div class="form-group">
          <label for="post">Post</label>
          <textarea name="post" rows="8" cols="80" id="post" class="form-control" v-model="postData.post"></textarea>
        </div>
        <input type="submit" name="submit" value="Submit Post" id="submit" class="btn btn-primary">
      </form>
    </div>
  </div>
</div>

这是Vue.js：

var edit = new Vue({
  el: '#postEdit',
  data: {
    postData: <?php echo $post ?>,
  },

  methods: {

  },
});

我的控制器：

   public function edit($id){
      $post = Post::find($id);
      return view('post.edit', compact('post'));
    }

Answer 1

你不应该像这样在JavaScript中使用PHP。使用客户端http客户端通过应用程序调用请求发布。

您不容使用PHP在JavaScript等̶t̶h̶a̶t̶.̶需要进行API获得那个职位第一，̶然后分配数据时的成功响应是̶r̶e̶c̶e̶i̶v̶e̶d̶.̶̶

编辑：

<>上没有post属性。你有回声的对象。使用postData并以此方式访问模型属性。

Laravel Vue.js不会绑定到输入文本

1 个答案: