Merge pull request #31 from k2tzumi/fix-default

Fix default
k2tzumi · Mar 23, 2024 · 6e9b0fc · 6e9b0fc
2 parents a5185da + 00d4f03
commit 6e9b0fc
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 11 deletions.
diff --git a/README.md b/README.md
@@ -45,8 +45,8 @@ You can create a poll by using the [QRCode component](#QRCode).
 ```xml
 <QRCode
   value="https://github.com/k2tzumi/slidev-addon-qrcode"
-  width="180"
-  height="180"
+  :width="180"
+  :height="180"
   color="4329B9"
   image="83095831.png"
 />

diff --git a/components/QRCode.vue b/components/QRCode.vue
@@ -8,12 +8,18 @@ import { watch, computed, onMounted, ref } from 'vue';
 
 const qrCodeRef: any = ref(null);
 
-const props = defineProps({
-  value: String,
-  color: String,
-  width: String,
-  height: String,
-  image: String,
+export interface Props {
+  value: string,
+  color: string,
+  width: number,
+  height: number,
+  image: string,
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  width: 200,
+  height: 200,
+  color: "000000",
 });
 
 const offsetColor = computed<string>(() => {
@@ -83,9 +89,9 @@ onMounted(async () => {
 });
 
 watch(
-  () => props.data,
+  () => props.value,
   (newValue) => {
-    qrCode.update({ ...options, value: newValue });
+    qrCode.update({ ...options, data: newValue });
   },
 );
 

diff --git a/example-export/001.png b/example-export/001.png
diff --git a/example.md b/example.md
@@ -5,4 +5,4 @@ layout: cover
 
 # Example slides
 
-<QRCode width="180" height="180" value="https://github.com/k2tzumi/slidev-addon-qrcode" color="4329B9" image="83095831.png" />
+<QRCode :width=180 :height=180 value="https://github.com/k2tzumi/slidev-addon-qrcode" color="4329B9" image="83095831.png" />
Original file line number	Diff line number	Diff line change
Expand Up		@@ -5,4 +5,4 @@ layout: cover

		# Example slides

		<QRCode width="180" height="180" value="https://github.com/k2tzumi/slidev-addon-qrcode" color="4329B9" image="83095831.png" />
		<QRCode :width=180 :height=180 value="https://github.com/k2tzumi/slidev-addon-qrcode" color="4329B9" image="83095831.png" />