vue实现结算淘宝购物车效果

• 实现单选时的价格，全选时价格
• 单选效果图

• 全选效果图

html

js

css

• 想写这个小demo好久啦，终于写好。

遇到的vue3.0写法

 
    import { Watch, Component, Vue, Emit, Prop } from "vue-class-decorator";
	// 没有组件
	@component
// 有组件

// import children from "./components/children.vue";

// @component({ components:{children} })
export class MyChildren extends Vue{

username = ""; // 名字

//userId 父子之间传值，必传默认是null

@Prop({ type: String, required: true, default: null})

userId: string;

@Emit("changeChildren")

changeChildren(){}
created(){}

mounted(){}

// 方法

cancel() {

// 调用自定义函数

this.changeChildren()

}

}