javascript - 使用 jQuery 和 Laravel append json 数据的更有效方法

Question

我正在使用 Laravel 和 jQuery 构建 Twitter 风格的提要。

我的问题是我确信我构建的逻辑很糟糕。

所以我有一个显示推文结果的包含 View 。

发送数据只是一个基本的 ajax post，带有一些 DOM 操作，这也很好。

提交表单后，我会显示新的推文并 append 。

但问题是，无论我如何构建逻辑，我总是会遇到重复。

所以我做什么

发送表单，成功函数将数据追加到 View

success: function(data) {

                if(data.status === "success") {
                    $('#tweet-textarea').val("");
                    $('#tweets-wrapper').prepend(data.content);
                }
            },

返回的方式如下。保存推文后，我将其返回到编码为 json 的数组中

$data = array('status' => 'success', 'content' => 
                '<div class="tweet-box">
                    <div class="media">
                      <a class="pull-left" href="#">
                       <img src="http://placehold.it/60x60" alt="">
                      </a>
                      <div class="media-body">
                        <h4 class="media-heading">
                            '. $this->tweet->user->metadata->full_name .'
                            <small>'. "@".$this->tweet->user->username .'</small>
                            <small>'. $this->tweet->created_at .'</small>
                        </h4>
                       '.  $this->tweet->message .'
                      </div>
                    </div>
                </div>');

我不知道最好的方法，我的问题实际上是在我的 Controller 中，我正在复制代码，因为返回的结果“数组中的内容”与我的 View 相同，所以如果我做了任何需要做的修改

那么有没有更有效的方法来做到这一点？

Answer 1

您可以使用 jQuery jPut 插件轻松 append json

<div jput="template">
  <div class="tweet-box">
                    <div class="media">
                      <a class="pull-left" href="#">
                       <img src="http://placehold.it/60x60" alt="">
                      </a>
                      <div class="media-body">
                        <h4 class="media-heading">{{}}</h4>
 </div>
</div>
</div>

</div>
<div id="main">
</div>

<script>
$(document).ready(function(){
//main is the div that you want to append
   $('#main').jPut({
       ajax_url:'domain.com/data.json',   //your json data page
       name:'template'  //jPut template name
   });
});
</script>

在你的 json 页面中不需要发送所有的 div

$data = array('status' => 'success', 'content' => $this->tweet->user->metadata->full_name);