PHP如何实现畅言留言板和网易跟帖样式呢？

DurkBlue2019-12-041629抢沙发

默认

摘要： 我要实现的就是下图的这种样式，原理需要在评论表添加两个主要字段 id 和 pid ，其他字段随意添加，比如文章id、回复时间、回复内容、回复人什么的。其中pid就是当前...

我要实现的就是下图的这种样式，

原理

需要在评论表添加两个主要字段 id 和 pid ，其他字段随意添加，比如文章id、回复时间、回复内容、回复人什么的。

其中pid就是当前已经回复过的评论的id。

从上图可以看出，里面每一层的pid就是就是他上一层评论的id。仔细观察下上面的布局。是不是很像PHP中的多维数组？如果你能想到，那么就简单了。

实现方法

前台这个比较简单就是div嵌div。然后设置div的border和margin padding就行了

<div class="comment" >  
    评论1
    <div class="comment">  
        评论3
        <div class="comment">  
            评论2
            <div class="comment">  
                评论4
            </div>
        </div>  
    </div> 
    <div class="comment">  
         评论5
    </div>   
</div>  
<div class="comment">  
    评论6
</div>

2、后台用到了两次递归，首先用递归把数据库中的结果重组下，重组之后，然后用递归输出上面的那种前台代码即可。

直接读出表中的所有评论。可以得到如下数组

Php代码

Array  
(  
    [0] => Array  
        (  
            [id] => 1  
            [pid] =>  
            [content] => 评论1  
        )  
    
    [1] => Array  
        (  
            [id] => 2  
            [pid] =>  
            [content] => 评论2  
        )  
    
    [2] => Array  
        (  
            [id] => 3  
            [pid] =>  1
            [content] => 评论3回复评论1  
        )  
    
    [3] => Array  
        (  
            [id] => 4  
            [pid] => 2
            [content] => 评论4回复评论2  
        )  
    
    [4] => Array  
        (  
            [id] => 5  
            [pid] => 1  
            [content] => 评论5回复评论1  
        )  
     [5] => Array  
        (  
            [id] => 6  
            [pid] =>   
            [content] => 评论6 
        ) 
)

然后我们就需要把这个数组重组成上面的那种留言板形式的

其中$array就是上面读取出来的数组，首先取出pid默认为空的，然后递归，在取出pid为当前评论id的数组

Php代码

public static function tree($array,$child="child", $pid = null)  
{  
    $temp = [];  
    foreach ($array as $v) {  
        if ($v['pid'] == $pid) {  
            $v[$child] = self::tree($array,$child,$v['id']);  
            $temp[] = $v;  
        }  
    }  
    return $temp;  
}

重组后，可以得到下面的这个数组，可以看到，这个数组的样式已经和前台评论样式很像了。

Php代码

Array  
(  
    [0] => Array  
        (  
            [id] => 1  
            [pid] =>  
            [content] => 评论1  
            [child] => Array  (
                   [0] => Array  
                        (  
                            [id] => 3  
                            [pid] => 1  
                            [content] => 评论3回复评论1  
                            [child] => Array ( )  
    
                        )
                   [1] => Array  
                        (  
                            [id] => 5  
                            [pid] => 1  
                            [content] => 评论5回复评论1  
                            [child] => Array ( )  
                        )
            )
        )  
    
    [1] => Array  
        (  
            [id] => 2  
            [pid] =>  
            [content] => 评论2  
            [child] => Array  
                (  
                    [0] => Array  
                        (  
                            [id] => 4  
                            [pid] => 2  
                            [content] => 评论4回复评论1  
                            [child] => Array ( )  
    
                        )  
    
                )  
    
        )  
    
    [2] => Array  
        (  
            [id] => 6  
            [pid] =>  
            [content] => 评论6  
            [child] => Array  ()  
        )  
    
)

得到上面的数组后，再用递归输出即可。

Php代码

public static function traverseArray($array)  
{  
    foreach ($array as $v) {  
        echo "<div class='comment' style='width: 100%;margin: 10px;background: #EDEFF0;
        padding: 20px 10px;border: 1px solid #777;'>";  
        echo $v['content'];  
        if ($v['child']) {  
            self::traverseArray($v['child']);  
        }  
        echo "</div>";  
    
    }  
    
}