style: vue format
This commit is contained in:
parent
e2fbd06893
commit
2936079790
|
@ -8,8 +8,8 @@
|
|||
"test": "vitest",
|
||||
"postinstall": "node scripts/postinstall.mjs",
|
||||
"pub": "npm run build && lerna publish --yes",
|
||||
"lint": "prettier --plugin-search-dir=. --ignore-path=.gitignore --list-different packages/**/*.{ts,tsx,js,svelte,json}",
|
||||
"lint:fix": "prettier --plugin-search-dir=. --ignore-path=.gitignore --write packages/**/*.{ts,tsx,js,svelte,json}",
|
||||
"lint": "prettier --plugin-search-dir=. --ignore-path=.gitignore --list-different packages/**/*.{ts,tsx,svelte,vue,json}",
|
||||
"lint:fix": "prettier --plugin-search-dir=. --ignore-path=.gitignore --write packages/**/*.{ts,tsx,svelte,vue,json}",
|
||||
"docs:dev": "vitepress dev docs",
|
||||
"docs:build": "vitepress build docs",
|
||||
"docs:serve": "vitepress serve docs"
|
||||
|
|
|
@ -42,17 +42,17 @@ import 'bytemd/dist/index.min.css'
|
|||
|
||||
```svelte
|
||||
<script>
|
||||
import { Editor, Viewer } from 'bytemd';
|
||||
import gfm from '@bytemd/plugin-gfm';
|
||||
import { Editor, Viewer } from 'bytemd'
|
||||
import gfm from '@bytemd/plugin-gfm'
|
||||
|
||||
let value;
|
||||
let value
|
||||
const plugins = [
|
||||
gfm(),
|
||||
// Add more plugins here
|
||||
];
|
||||
]
|
||||
|
||||
function handleChange(e) {
|
||||
value = e.detail.value;
|
||||
value = e.detail.value
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -3,7 +3,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import * as bytemd from 'bytemd';
|
||||
import * as bytemd from 'bytemd'
|
||||
|
||||
export default {
|
||||
props: {
|
||||
|
@ -22,26 +22,26 @@ export default {
|
|||
const editor = new bytemd.Editor({
|
||||
target: this.$el,
|
||||
props: this.$props,
|
||||
});
|
||||
})
|
||||
editor.$on('change', (e) => {
|
||||
this.$emit('change', e.detail.value);
|
||||
});
|
||||
this.editor = editor;
|
||||
this.$emit('change', e.detail.value)
|
||||
})
|
||||
this.editor = editor
|
||||
},
|
||||
watch: {
|
||||
$props: {
|
||||
handler(newValue, oldValue) {
|
||||
// TODO:
|
||||
const copy = { ...newValue };
|
||||
const copy = { ...newValue }
|
||||
for (let k in copy) {
|
||||
if (copy[k] === undefined) {
|
||||
delete copy[k];
|
||||
delete copy[k]
|
||||
}
|
||||
}
|
||||
this.editor.$set(copy);
|
||||
this.editor.$set(copy)
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
|
|
@ -3,38 +3,38 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { getProcessor } from 'bytemd';
|
||||
import { getProcessor } from 'bytemd'
|
||||
|
||||
export default {
|
||||
props: ['value', 'plugins', 'sanitize'],
|
||||
computed: {
|
||||
file() {
|
||||
try {
|
||||
return getProcessor(this.$props).processSync(this.value);
|
||||
return getProcessor(this.$props).processSync(this.value)
|
||||
} catch (err) {
|
||||
console.error(err);
|
||||
console.error(err)
|
||||
}
|
||||
},
|
||||
needUpdate() {
|
||||
return [this.file, this.plugins, this.sanitize];
|
||||
return [this.file, this.plugins, this.sanitize]
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
needUpdate: {
|
||||
handler(val) {
|
||||
this.off();
|
||||
this.off()
|
||||
this.$nextTick(() => {
|
||||
this.on();
|
||||
});
|
||||
this.on()
|
||||
})
|
||||
},
|
||||
deep: true,
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.on();
|
||||
this.on()
|
||||
},
|
||||
beforeDestroy() {
|
||||
this.off();
|
||||
this.off()
|
||||
},
|
||||
methods: {
|
||||
on() {
|
||||
|
@ -43,24 +43,24 @@ export default {
|
|||
({ viewerEffect }) =>
|
||||
viewerEffect &&
|
||||
viewerEffect({ markdownBody: this.$el, file: this.file })
|
||||
);
|
||||
)
|
||||
}
|
||||
},
|
||||
off() {
|
||||
if (this.cbs) {
|
||||
this.cbs.forEach((cb) => cb && cb());
|
||||
this.cbs.forEach((cb) => cb && cb())
|
||||
}
|
||||
},
|
||||
handleClick(e) {
|
||||
const $ = e.target;
|
||||
if ($.tagName !== 'A') return;
|
||||
const $ = e.target
|
||||
if ($.tagName !== 'A') return
|
||||
|
||||
const href = $.getAttribute('href');
|
||||
if (!href || !href.startsWith('#')) return;
|
||||
const href = $.getAttribute('href')
|
||||
if (!href || !href.startsWith('#')) return
|
||||
|
||||
const dest = this.$el.querySelector('#user-content-' + href.slice(1));
|
||||
if (dest) dest.scrollIntoView();
|
||||
const dest = this.$el.querySelector('#user-content-' + href.slice(1))
|
||||
if (dest) dest.scrollIntoView()
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
</script>
|
||||
|
|
Loading…
Reference in New Issue