这种聊天样式该如何动态添加组件

zisuting

  这种的 我该在content里如何动态添加

zisuting

这里只是写死了两个div 来出来样式  问题是多了我该如何动态添加

lvsazf

可以通过加载的当前数据，通过bind-css或bind-style动态绑定

zisuting

lvsazf 发表于 2016-7-24 14:42
可以通过加载的当前数据，通过bind-css或bind-style动态绑定

具体怎么说 有点不太明白  感谢哈

zisuting

已经实现了 可以结贴 感谢

yunkaiyang

请问，怎么实现的？

zisuting

yunkaiyang 发表于 2016-8-3 16:14
请问，怎么实现的？

div 动态设置 bind-css属性

比如 {'receiver'index() %2 == 1 , 'sender'index() %2 == 0}

zisuting

    .sender{
            clear:both;
        }
        .sender div:nth-of-type(1){
            float: left;
        }
        .sender div:nth-of-type(2){
            background-color: aquamarine;
            float: left;
            margin: 0 20px 10px 15px;
            padding: 10px 10px 10px 0px;
            border-radius:7px;
        }

        .receiver div:first-child img,
        .sender div:first-child img{
            width:50px;
            height: 50px;
        }

        .receiver{
            clear:both;
        }
        .receiver div:nth-child(1){
            float: right;
        }
        .receiver div:nth-of-type(2){
            float:right;
            background-color: gold;
            margin: 0 10px 10px 20px;
            padding: 10px 0px 10px 10px;
            border-radius:7px;
        }

        .left_triangle{
            height:0px;  
            width:0px;  
            border-width:8px;  
            border-style:solid;  
            border-color:transparent aquamarine transparent transparent;  
            position: relative;
            left:-16px;
            top:3px;
        }

        .right_triangle{
            height:0px;  
            width:0px;  
            border-width:8px;  
            border-style:solid;  
            border-color:transparent transparent transparent gold;  
            position: relative;
            right:-16px;
            top:3px;
        }

zisuting

动态设置bind-css即可