我不知道如何用Vue 3获取数据?我创建了一个操作,并通过此操作调用端点(https://api.openbrewerydb.org/breweries/5494)。我没有收到响应数据。
端点:
import { createStore } from 'vuex'
export default createStore({
state: {
},
mutations: {
},
actions: {
async getData() {
await fetch('https://api.openbrewerydb.org/breweries/5494', {
method: 'get',
headers: { 'Content-type': 'application/json' },
}).then((response) => {
if (!response.ok) {
throw Error(response.statusText);
}
console.log('response: ', response)
}).catch((error) => {
console.log('Looks like there was a problem: \n', error);
});
}
},
modules: {
}
})
Run Code Online (Sandbox Code Playgroud)
Vue组件:
<template>
<div @click="loadData">Load Data</div>
</template>
<script>
import { useStore } from 'vuex'
export default …
Run Code Online (Sandbox Code Playgroud)我试图在 vue 3 中使用 vuex 模块。我不确定我做错了什么?
我将 index.js 作为主文件,其余的我计划将其放入模块文件夹中。
当我想调度操作时,出现错误:“[vuex] 未知操作类型:users/registerUser”。
索引.js
import { createStore } from 'vuex'
import users from './modules/users'
export default createStore({
state: {
},
mutations: {
},
actions: {
},
modules: {
users
}
})
Run Code Online (Sandbox Code Playgroud)
Vue 文件中的调度操作
const registration = () => {
store.dispatch('users/registerUser', {
firstName,
lastName,
email,
password
})
}
Run Code Online (Sandbox Code Playgroud)
用户.js
import { createStore } from 'vuex'
export default createStore({
namespaced: true,
state: {
user: {
firstName: null,
lastName: null,
email: null,
}
}, …
Run Code Online (Sandbox Code Playgroud)我将数组作为道具传递给另一个组件,当我想在该组件中安装时读取此内容时,我得到了 Proxy {}。如何从这个道具中读取数据?您可以在示例中看到,当我想要控制台 log prop 时,结果是 Proxy\xc2\xa0{}。我可以看到 HTML 结构中的所有值,但不能在安装的控制台中看到。
\n<template>\n <div class="custom-select-container">\n <div class="selected-item" @click="openSelect">\n <span class="selected-items-text">{{ selectedItem.name }}</span>\n <span class="icon-arrow1_b selected-items-icon" :class="{ active: showOptions }" />\n </div>\n <transition name="fade">\n <ul v-show="options.length && showOptions" class="custom-select-options">\n <li v-for="(option, index) in options" :key="index" class="custom-select-item">{{ option.name }}</li>\n </ul>\n </transition>\n </div>\n</template>\n\n<script>\nimport { ref, onMounted } from \'vue\'\n\nexport default {\n props: {\n options: {\n type: Array,\n default: () => []\n }\n },\n\n setup(props) { \n let showOptions = ref(false);\n let selectedItem = …
Run Code Online (Sandbox Code Playgroud)