layui.rate评分组件,同一个页面如何同时多个位置动态显示

提问 已结 11 1790
土货
土货 2018-8-7
悬赏:20飞吻
版本:layui 2.x 浏览器:


【有评分值,主要需求就是展示系统已有的评分值】
如上图,我希望每个名字后面都有评分(程序是循环输出通讯录数据的);通过layui.rate组件如何实现多个评分?
回帖
  • 这种问题首先要考虑的是组件本身支持不支持elem设置为一类dom的selector的方式来一次性渲染多个节点,如果满足,那么可以给他们添加一个class之类的,然后渲染,这种情况一般会配套的有可以将render中的配置信息放在节点上的支持,达到一次性render出来的时候每个节点可以有自己的值啊或者样式之类的设置。然后翻api会发现很模糊根本没有这方面的介绍,然后再看示例会发现也没有这个介绍,所以到这里可以百分之八十的确定,是不可以的,然后不要死心自己在本地写个例子试试,如果发现还是不行,那就基本可以断定是不可以的了。这个验证的方法也同样使用到laydate和upload,你就会发现upload支持一次性渲染多个节点,laydate不支持,如果elem对应的节点有多个,只有第一个会正常显示出日期控件,其他的后面的会闪退之类的异常情况。
    然后是怎么渲染页面上多个相同组件的问题了,比如你的rate组件,可以给同类都加上一个相同的样式比如:'my_rate’,然后就是另外一个新手接触经常要有误区的或者被别人带偏的,就是elem的这个设置,文档里面写了是可以是一个string/object,"指向容器选择器",实际上如果做了其他的组件之类的就应该能猜到其实这个elem同样支持传进去一个dom,那么事情就好办了。
    先看看错误的使用例子

    效果

    看着都能出来,但是别高兴太早,通过动图可以看到里面点击了没用,也没有任何划过动画之类的,基本前面几个就是一个空壳,没半点用,只有最后一个是正常的。
    看看对的

    效果

    可以看到正常是要遍历出来然后再一个一个初始化,这个跟laydate是一样的,不支持同时渲染多个,得自己遍历。
    那么,再升级一下,这样子如何设置没个rate的特殊属性,比如他们的值呀颜色呀之类的呢?这个其实上面说过类似的了,就是可以把这些配置信息一开始放在这些节点的属性里面。

    效果
    2 回复
  • 凉宫
    2018-8-7
    直接在遍历的时候多写几个rate.render?
    0 回复
  • 土货
    2018-8-8
    @岁月小偷 详细学习了
    0 回复
  • 土货
    2018-8-8
    @hsianglee 这思路也行,但是和程序对接起来还是有效不方便
    0 回复
  • @岁月小偷 为什么lay-data的值是整数 比如lay-data="3" 出来的是两星半? 而且这样子写 lay-data="{value:3.5}"无效?
    0 回复
  • @岁月小偷 sorry 少加了东西 好了。谢谢
    0 回复
  • @木子很胖 嗯嗯[微笑] 不客气
    0 回复
  • @岁月小偷 那多个的评分的时候,怎么把name和评分选中的星值传给后台啊? 比如用户评了三星,然后提交,这个评分值 和name怎么传?[衰]
    0 回复
  • @岁月小偷 之前写的评分直接是一个input框 然后用户提交的时候我把name写在input上 然后获取input的值传过去的,现在是需要加星值[伤心]
    0 回复
  • @木子很胖 关键看你要给什么样子的额,如果他们都是不同的字段,那么name自然是不一样的比如name="rate1",name="rate2",但是如果你的频分是一个属性rates,这个属性的值是一个数组,那么name不能直接设置成rates,如果多个name是rates,那么最后得到的只有最后一个的元素的值,要用name="rates[]"加多个中括号,
    0 回复