vue 프레임 워 크 에서 사용자 정의 스크롤 바(easyscroll)구현

//    jsx  ，       vue-jsx  
npm install babel-plugin-syntax-jsx --save-dev
npm install babel-plugin-transform-vue-jsx --save-dev
npm install babel-helper-vue-jsx-merge-props --save-dev
npm install babel-preset-es2015 --save-dev

//  .babelrc  
{
  "presets": [
    ["es2015", { "modules": false }],
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime"],
  "env": {
    "test": {
      "presets": ["env", "stage-2"],
      "plugins": ["istanbul"]
    }
  }
}

//      
npm isntall --save easyscroll

//main.js 
import EasyScroll from 'easyscroll';
Vue.use(EasyScroll);

//       
myBarOption:{
  barColor:"#959595",   //     
  barWidth:6,           //     
  railColor:"#eee",     //    
  barMarginRight:0,     //                 （px）
  barMaginBottom:0,     //             （px)
  barOpacityMin:0.3,      //             
  zIndex:"auto",        //   z-Index
  autohidemode:true,     //      
  horizrailenabled:true,//         
}

//    

    

      

              
      
    


   data{
     return{
       data(){
         myBarOption:{
           barColor:"red"
         }
       }
     }
   }

//        



export default {
  data(){
    return {
      scrollHeight: 0,         //EasyScrollbar          
      myBarOption: {
        barColor:"#959595",   //     
        barWidth:6,           //     
        railColor:"#eee",     //    
        barMarginRight:0,     //                 （px）
        barMaginBottom:0,     //             （px)
        barOpacityMin:0.3,      //             
        zIndex:"auto",          //   z-Index
        autohidemode:true,     //      
        horizrailenabled:true,//         
      }
    }
  },
  created: function() {
    this.init();
  },
  methods:{
    init: function() {
      //               ，     EasyScrollbar       
      this.scrollHeight = document.documentElement.clientHeight-50;
    }
  }
}