1、pywebview后端
python
复制代码
class Api:
def greet(self, test_text):
print(test_text)
return f"hello, {test_text}"
if __name__ == '__main__':
# 前后端通信测试
api = Api()
window = webview.create_window('Vue app in pywebview', './static/index.html', js_api=api) # vue的build文件的路径
webview.start(debug=True)
2、Vue3前端
javascript
复制代码
<template>
<div id="app">
<h1>Greeting Test</h1>
<button @click="greet">Greet</button>
<p>{{ greeting }}</p>
</div>
</template>
<script>
export default {
data() {
return {
greeting: ''
};
},
methods: {
greet() {
// 调用后端API
if (window.pywebview) {
window.pywebview.api.greet('Socket test').then(response => {
this.greeting = response;
console.log(this.greeting);
});
}
}
}
};
</script>
<style>
#app {
text-align: center;
margin-top: 50px;
}
</style>