前端开发
北京前端外包 电话:186-2237-7561
服务客户有中国移动、方正国际、中百集团等
Search:DIV
目录结构： src src/htmlsrc/jssrc/json package.json{ "author": "Your Name", "license": "ISC", "type": "module",...目录结构： src src/htmlsrc/jssrc/json package.json{ "author": "Your Name", "license": "ISC", "type": "module", "dependencies": { "fs": "^0.0.1-security", "marked": "^14.1.1", "openai": "^4.58.0" }}js/config.js // 指定要创建的 JSON 文件的路径const filePathJson = '../json/data.json'; export { filePathJson } fsHandle.js内容import fs from 'fs'; // 导入 fs 模块 export function creatJson(filePath, jsonContent) { // 使用 fs.writeFile 方法写入 JSON 文件 fs.writeFile(filePath, jsonContent, (err) => { if (err) { console.error('An error occurred:', err); return; } console.log('JSON data has been saved to', filePath); });} libkimi.js 内容 import { OpenAI } from "openai"; const client = new OpenAI({ apiKey: "", // 在这里将 MOONSHOT_API_KEY 替换为你从 Kimi 开放平台申请的 API Key baseURL: "https://api.moonshot.cn/v1",}) export async function someAsyncOperation(obj) { // 模拟一个异步操作，比如从API获取数据 return new Promise(async (resolve) => { const completion = await client.chat.completions.create({ model: "moonshot-v1-8k", messages: [ {"role": "system", "content": "你是 Kimi，由 Moonshot AI 提供的人工智能助手，你更擅长中文和英文的对话。你会为用户提供安全，有帮助，准确的回答。同时，你会拒绝一切涉及恐怖主义，种族歧视，黄色暴力等问题的回答。Moonshot AI 为专有名词，不可翻译成其他语言。"}, {"role": "user", "content":obj.title} ], temperature: 0.3, }) resolve(completion.choices[0].message.content) }); } test.js 执行文件import { someAsyncOperation } from './libkimi.js';import { marked } from 'marked';import { creatJson } from './fsHandle.js';import { filePathJson } from './config.js';import fs from 'fs'; // 导入 fs 模块 let array = [{ title: "帮我写理财融资最好的方案都有哪些"}, { title: "帮我写提升工作效率的方案"}, { title: "帮我写如何更好的向上管理"}] async function asyncMapWithAwait(array, asyncFunction) { const results = []; for (const item of array) { let markdownText = await asyncFunction(item); console.log(markdownText); //单独数据 let htmlText = marked.parse(markdownText) fs.writeFileSync(`../html/${item.title}.html`, htmlText); let tempJson = { title: item.title, content: marked.parse(htmlText) } results.push(tempJson); } return results;} console.log("config.filePath.json",filePathJson) // 使用asyncMapWithAwait(array, someAsyncOperation).then((results) => { console.log(results); // 输出: [2, 4, 6, 8, 10] // 将 JSON 对象转换为字符串 let jsonContent = JSON.stringify(results, null, 2); // 使用缩进为 2 空格的格式 creatJson(filePathJson, jsonContent)});
在 Vue 3 中，如果你想在 setup 函数中监听 URL 的变化，可以使用 Vue Router 的导航守卫（Navigation Guards）或者 Vue 的响应式 API 来实现。以下是两种常见的方法：...在 Vue 3 中，如果你想在 setup 函数中监听 URL 的变化，可以使用 Vue Router 的导航守卫（Navigation Guards）或者 Vue 的响应式 API 来实现。以下是两种常见的方法：方法 1: 使用 Vue Router 的导航守卫如果你的 Vue 3 应用使用了 Vue Router，你可以利用 Vue Router 提供的导航守卫来监听 URL 的变化。 全局守卫: 你可以在应用的入口文件中（通常是 main.js 或 main.ts）设置全局守卫。 javascriptimport { createRouter, createWebHistory } from 'vue-router'; const router = createRouter({ history: createWebHistory(), routes: [ // 定义路由 ] }); router.beforeEach((to, from, next) => { // 监听 URL 变化 console.log('路由变化：', from.path, '->', to.path); next(); }); export default router; 组件内守卫: 如果你只想在特定组件中监听 URL 变化，可以在该组件内使用 beforeRouteEnter 或 beforeRouteUpdate 守卫。 javascriptexport default { beforeRouteEnter(to, from, next) { console.log('路由变化：', from.path, '->', to.path); next(); }, beforeRouteUpdate(to, from, next) { console.log('路由变化：', from.path, '->', to.path); next(); }, }; 方法 2: 使用 Vue 的响应式 API 监听 window.location如果你的应用没有使用 Vue Router，或者你只是想监听浏览器地址栏的变化，可以使用 Vue 的响应式 API 来监听 window.location 的变化。 使用 watchEffect 或 watch: javascriptimport { watchEffect, ref } from 'vue'; export default { setup() { const url = ref(window.location.href); watchEffect(() => { // 监听 URL 变化 console.log('URL 变化：', url.value); }); // 监听 window 的 popstate 事件（如用户点击浏览器的前进或后退按钮） window.addEventListener('popstate', () => { url.value = window.location.href; }); // 返回响应式数据 return { url }; } }; 请注意，使用 watchEffect 或 watch 来监听 window.location 的变化可能需要手动处理一些特殊情况，比如用户使用浏览器的前进或后退按钮时，并不会触发 popstate 事件。此外，这种方法可能不如使用 Vue Router 的导航守卫那样方便和强大，特别是在复杂的单页应用中。总的来说，选择哪种方法取决于你的应用是否使用了 Vue Router，以及你希望监听 URL 变化的具体场景。
