sassは変数値に基づいてskinを変更する方法

/*      */
$color-primary-green:green;
/*       */
$color-primary-blue:blue;
/*       */
$data-defalut:"green"

@mixin color_primary() {
    &[data-txt="green"] {
        background: $color-primary-green;
    }

    &[data-txt="blue"] {
        background: $color-primary-blue;
    }

}

.price {
    height: 400px;

    /*color: $color-primary;*/
    /*       ，   */
    &::before {
        content: attr(data-txt);
    }

    @include color_primary();
    /*        */
}

 



    import { Vue, Component, Prop, Watch, Emit } from 'vue-property-decorator'
    import { mixins } from 'vue-class-component'
    
bgColor: string = "blue";
 private changeSkin() {
            //this.$refs.bgDom.attributes('data-txt', 'green');
            this.bgColor = this.bgColor == "blue" ? "green" : "blue";
        }
        </code></pre> 
 <p>    </p> 
 <p>git     。    </p> 
</div>
                            </div>
                        </div>
                    </div>
                    <!--PC WAP    -->
                    <div id="SOHUCS" sid="1197722121405571072"></div>
                    <script type="text/javascript" src="/views/front/js/chanyan.js">
                    
                     
                
                

                    

                        
                        

                             
                        
                        
                        

                             
                        
                        
                        

                             
                        
                    
                
            

興味があるかもしれません