问题1:想要在一个panel标签中添加一个图片,panel中有一个datalist属性。如何设计标签可以插入想要的图片。

template:

  <panel :list="dataList"></panel>

script:

export default {
      components: {ViewBox,Panel},
      name: "home",
      data() {
        return {
          dataList:[{
            src:this.$store.state.getCookie('headImg'),
            title:this.$store.state.getCookie('name')+"<i></i>",
          }]
        }
},

    解决办法:在datalist的title属性中添加图片标签(以string相加的形式),并且用name对性别进行判断。panel组件是vux库中的一个组件,详细的使用见https://vux.li/demos/v2/#/component/panel

export default {
      components: {ViewBox,Panel},
      name: "home",
      data() {
        let name = this.$store.state.getCookie('name');
        let icon_sex_woman = sex_woman;
        // alert(name);
        if(name != '杨紫'){
          icon_sex_woman=sex_man;
        }
        return {
          dataList:[{
            src:this.$store.state.getCookie('headImg'),
            title:this.$store.state.getCookie('name')+"<i></i><img src="+ icon_sex_woman +" style='width:0.8445789rem;margin-top:0.0767rem; margin-right:0.9rem ;margin-left:0.617rem;'/>",
          }]
        }
      },

问题2:在vue中css样式的导入,less是一种预处理css样式。

          

<style lang="less">

  @import '~vux/src/styles/reset.less';

</style>

 

posted on 2018-07-24 01:39  ソウ  阅读(133)  评论(0编辑  收藏  举报