Button 按钮 #

<template>
  <div class="container">
    <aux-noble-button >
      <span>加入购物</span>
    </aux-noble-button>
    <aux-noble-button  disabled>
      <span>禁止</span>
    </aux-noble-button>
    <aux-noble-button type="primary"   fill>
      <span>主要按钮</span>
    </aux-noble-button>
    <aux-noble-button type="success"   fill>
      <span>登陆微信</span>
    </aux-noble-button>
    <aux-noble-button type="confirm"   fill>
      <span>确认购买</span>
    </aux-noble-button>
  </div>
</template>
<script lang="ts" setup>
import { defineComponent, ref } from 'vue';

import {  NobleButton as AuxNobleButton } from "../../../../../aux-ui/main"



</script>
<style scoped>
.container {
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  perspective: 600px;
  background-color: #813705;
}
</style>

<template>
  <div class="container">
    <aux-noble-button round >
      <span>加入购物</span>
    </aux-noble-button>
    <aux-noble-button fill round>
      <span>筛选</span>
      <i class="iconfont icon-control1"></i>
    </aux-noble-button>
    <aux-noble-button  circle>
      <i class="iconfont icon-shopping-cart-fill"></i>
    </aux-noble-button>
    <aux-noble-button  circle fill>
      <i class="iconfont icon-shopping-cart-fill"></i>
    </aux-noble-button>
  </div>
</template>
<script lang="ts" setup>
import { defineComponent, ref } from 'vue';

import {  NobleButton as AuxNobleButton } from "../../../../../aux-ui/main"


const words = ref("So do i")
</script>
<style scoped>

@import url(//at.alicdn.com/t/c/font_3882013_q5u06iila8.css);
.icon-control1{
  font-size: 20px;
  margin-left: 5px;
}
.container {
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  perspective: 600px;
  background-color: #813705;
}
</style>

<template>
  <div class="container">
    <aux-noble-button underline >
      <span>加入购物</span>
    </aux-noble-button>
    <aux-noble-button  round underline>
      <span>即可订购</span>
    </aux-noble-button>
  </div>
</template>
<script lang="ts" setup>
import { defineComponent, ref } from 'vue';

import {  NobleButton as AuxNobleButton } from "../../../../../aux-ui/main"


const words = ref("So do i")
</script>
<style scoped>
.container {
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  perspective: 600px;
  background-color: #813705;
}
</style>

<template>
  <div class="container">
    <aux-noble-button color="rgba(0,0,0,.4)" >
      <span>加入购物</span>
    </aux-noble-button>
    <aux-noble-button  color="yellow" underline round>
      <span>即可订购</span>
    </aux-noble-button>

  </div>
</template>
<script lang="ts" setup>
import { defineComponent, ref } from 'vue';

import {  NobleButton as AuxNobleButton } from "../../../../../aux-ui/main"


const words = ref("So do i")
</script>
<style scoped>
.container {
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  perspective: 600px;
  background-color: #813705;
}
</style>