鍍金池/ 問答/ HTML問答
近義詞 回答

你可以用methods來實(shí)現(xiàn),這樣簡(jiǎn)潔一些。
Html:

<div id="dataList">
 <div :class="setColor(data1)">{{data1}}</div>
 <div :class="setColor(data2)">{{data2}}</div>
 <div :class="setColor(data3)">{{data3}}</div>
</div>

JS:

new Vue({
  el: '#dataList',
  data: {
   data1: 12,
   data2: -12,
   data3: 0
  },
  methods:{
    setColor: function(dataVal){
      if(dataVal > 0) return 'red';
      if(dataVal < 0) return 'green';
      return 'default';
    }
  }
});

Css:

.red {
  color: red;
}
.green {
  color: green;
}
.default {
  color: gray;
}
夕顏 回答

.sample-1 {

    display: inline-block;
    width: 200px;
    border: 1px solid black;
    vertical-align:middle;
}

.sample-2 {
    width: 200px;
    display: inline-block;
    border: 1px solid orange;
    vertical-align:middle;
}
北城荒 回答

加密就是加密,不是防止別人刷接口的,刷接口可以用控頻來進(jìn)行限制;

青裙 回答

我的記得route的樣式是可以設(shè)置的,提供兩個(gè)思路
1、用圓頭的線樣式
2、在轉(zhuǎn)彎的關(guān)鍵點(diǎn)添加點(diǎn)marker(這個(gè)比較確定,是可以的)

使用this.$route.query代替this.$route.params

焚音 回答

這個(gè)不是 Vue 的問題,是你自己代碼的問題。你仔細(xì)看一下你自己的代碼,鉤子函數(shù)那里,createdmounted 都是普通聲明方式;而事件處理函數(shù)那里,則是用的箭頭函數(shù)。箭頭函數(shù)會(huì)固定把 this 綁定到執(zhí)行時(shí)的上下文,所以兩者出現(xiàn)了差異。

所以,Vue 組件的函數(shù)要避免使用箭頭函數(shù),Vue 會(huì)幫助你把 this 處理到當(dāng)前實(shí)例上。

萌吟 回答

微信官方回復(fù)了:因?yàn)閞px在換算的過程中不可避免地會(huì)出現(xiàn)小數(shù)點(diǎn)的情況。這時(shí)顯示上就有可能出現(xiàn)1-2px的誤差。如果對(duì)樣式要求比較高的話,建議使用 CSS 的 media-query來做響應(yīng)式頁面。

clipboard.png

你現(xiàn)在不是選擇 .more_img 節(jié)點(diǎn)么?怎么會(huì)有img標(biāo)簽的樣式?

======================
補(bǔ)充(主要是由于scoped作用域引起的):
1.https://vue-loader.vuejs.org/...
2.去掉 scoped

淡墨 回答

因?yàn)榧^函數(shù)不綁定上下文

入她眼 回答
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <script type="text/javascript">
            var list = [{
                "authorityId": 1,
                "authorityName": "數(shù)據(jù)分析",
                "grade": "1001",
                "fatherId": "0"
            },
            {
                "authorityId": 2,
                "authorityName": "商務(wù)政策",
                "grade": "1002",
                "fatherId": "0"
            },
            {
                "authorityId": 3,
                "authorityName": "市場(chǎng)動(dòng)態(tài)",
                "grade": "1003",
                "fatherId": "0"
            },
            {
                "authorityId": 4,
                "authorityName": "消息中心",
                "grade": "1004",
                "fatherId": "0"
            },
            {
                "authorityId": 5,
                "authorityName": "個(gè)人中心",
                "grade": "1005",
                "fatherId": "0"
            },
            {
                "authorityId": 6,
                "authorityName": "價(jià)格查詢分析",
                "grade": "2101",
                "fatherId": "1001"
            },
            {
                "authorityId": 7,
                "authorityName": "銷量查詢分析",
                "grade": "2102",
                "fatherId": "1001"
            },
            {
                "authorityId": 8,
                "authorityName": "裝備查詢分析",
                "grade": "2103",
                "fatherId": "1001",
            },
            {
                "authorityId": 9,
                "authorityName": "政策數(shù)據(jù)分析",
                "grade": "2201",
                "fatherId": "1002"
            },
            {
                "authorityId": 10,
                "authorityName": "政策原件下載",
                "grade": "2202",
                "fatherId": "1002"
            },
            {
                "authorityId": 11,
                "authorityName": "新車上市",
                "grade": "2301",
                "fatherId": "1003"
            },
            {
                "authorityId": 12,
                "authorityName": "營銷活動(dòng)",
                "grade": "2302",
                "fatherId": "1003"
            }
        ]

        var data = []


        function loop(list, data, fatherId) {
            list.forEach(item => {
                if (item.fatherId === fatherId) {
                    var child = {
                        label: item.authorityName,
                        grade: item.grade,
                        children: []
                    }

                    loop(list, child.children, item.grade)

                    data.push(child)
                }
            })
        }
        
        loop(list, data, '0')

        console.log(data)

    </script>
</body>
</html>
話寡 回答

chart組件設(shè)置寬度,可能根據(jù)數(shù)據(jù)計(jì)算。
然后在外層的div上設(shè)置overflow-x: auto就可以了。

@kybetter 請(qǐng)問是如何解決的? 遇到配置‘postcss-pxtorem’, 我寫在vue.config.js中 不生效,問題基本和題主一樣

css: {
    loaderOptions: {
        postcss: {
            'postcss-pxtorem': {
                 rootValue: 75
             },
            'postcss-theme-variables': {
                vars: {
                    white: '#000'
                },
                prefix: '$'
            }
        }
    }
}
凝雅 回答

看來你對(duì)前端一無所知,改成下面:

PS: 請(qǐng)把你的script放到canvas元素的下方

<script>
function watermark(str){
   var img = document.getElementById("img");
   var canvas=document.getElementById("cvs");
   var ctx=canvas.getContext("2d");
   ctx.drawImage(img,0,0);
   ctx.font="20px microsoft yahei";
   ctx.fillStyle = "rgba(255,255,255,0.5)";
   ctx.fillText(str,100,100);
}
watermark('Hello world')
</script>

在線demo地址: https://codepen.io/zhipenglu/...

款爺 回答

雙指放大就像用放大鏡來看一樣, ctrl++/-縮放頁面將引起頁面的重排重繪與媒體查詢

硬扛 回答

context.commit('getCertificationStatus',res.data.content)

薄荷糖 回答

你不知道一個(gè)對(duì)象可以有多個(gè)key嗎,放一個(gè)對(duì)象里咯

別硬撐 回答

如果是SPA,就用全局狀態(tài)管理帶過去,如果是多頁,考慮url帶參數(shù)或者本地緩存

女流氓 回答

給你寫個(gè)

 var arr = [{id: "1",name:"11",comment:"1"},{id: "2",name:"22",comment:"22"},{id: "333",name:"333",comment:"333"}];
var str=`
        <table border="4">
            <thead>
                <tr>
                    <th>id</th><th>name</th><th>comment</th></tr>
            </thead>
            <tbody>
            ${
                arr.map(o => {
                    return `<tr>
                                <td>${o.id}</td>
                                <td>${o.name}</td>
                                <td>${o.comment}</td>
                            </tr>`
                }).join('')
            }
            </tbody>
         </table>
         `
document.querySelector('#table-wrap').innerHTML=str

實(shí)際效果
圖片描述