美文网首页我爱编程
vue加载更多+小点位数

vue加载更多+小点位数

作者: 柒到彩虹 | 来源:发表于2018-06-21 14:53 被阅读0次

    改变小数位数

    js普通版

    //将传入数据转换为字符串,并清除字符串中非数字与.的字符  
         //按数字格式补全字符串  
         var getFloatStr = function(num){  
             num += '';  
             num = num.replace(/[^0-9|\.]/g, ''); //清除字符串中的非数字非.字符  
               
             if(/^0+/) //清除字符串开头的0  
                 num = num.replace(/^0+/, '');  
             if(!/\./.test(num)) //为整数字符串在末尾添加.00  
                 num += '.00';  
             if(/^\./.test(num)) //字符以.开头时,在开头添加0  
                 num = '0' + num;  
             num += '00';        //在字符串末尾补零  
             num = num.match(/\d+\.\d{2}/)[0];  
         };   
    

    js tofixed方法

     tofixed方法
        //方法可以把NUMBER四舍五入为指定小数位数的数字
         toFixed() 
         //语法
         //num是规定小数位数
         NumberObject.toFixed(num)   
         //具体用法
         var num=new Number(13.37)
         num=num.toFixed(1)
    

    官方地址

    http://www.w3school.com.cn/jsref/jsref_tofixed.asp

    vue加载更多

    <template>
        <div class="box">
        <div class="list">
            <ul>
                <li v-for="(item,index) in lists" :key="item.id">{{item.comment}}</li>
            </ul>
            <button @click="getlist()">加载更多</button>
        </div>
        </div>
    </template>
    
    <script>
        export default {
            name:"box",
            data(){
                return{
                    lists:[],
                    page:1,
                    row:10
                }
            },
            methods:{
                getlist(){
                //page页数  rows条数
                    this.$http.get("xxx?page="+this.page+"&rows=10").then((res)=>{
                       this.lists=this.lists.concat(res.data.data.list)
                    })
                }
            },
            created(){
                this.getlist();
            }
            
        }
        
    </script>
    
    <style scoped>
        *{
            margin: 0;
            padding: 0;
        }
        li{
            list-style: none;
            margin-top: 10px;
        }
        .list{
            margin: 20px;
        }
        button{
            margin-top: 20px; 
            background: red; 
            border: none; 
            padding:5px 15px; 
            color: #fff;
        }
    </style>
    

    相关文章

      网友评论

        本文标题:vue加载更多+小点位数

        本文链接:https://www.haomeiwen.com/subject/nfumlftx.html