尝试 post 表单使用 RTK 查询到 nodejs
trying to post form using RTK query to nodejs
尝试 post 使用 RTK 查询变异到 nodejs
**endpoint nodejs i have posted using
fetch(`const handleAddproduct=()=>{
fetch('http://localhost:9000/api/v1/admin/product/new',{
method:"POST",
headers:{"Content-Type":"application/json"},
body:JSON.stringify(newproduct)
}).then(()=>{
console.log("new Product added")
})
}`*
but while using rtk mutation it's not post
const handleAddproduct=async()=>{
await Addproductnew(createProduct).unwrap()
.then((payload) => console.log('fulfilled', payload))
.catch((error) => console.error('rejected', error))
}
*export const productApi = createApi({
tagTypes: ['Product'],
reducerPath: 'productApi',
baseQuery: fetchBaseQuery({ baseUrl: "http://localhost:9000/" }),
endpoints: (builder) => ({
getProduct: builder.query({query:(id)=>createRequest(`api/v1/product/${id}`)}),
getAllProductsByName: builder.query({query:()=>createRequest(`api/v1/products`)}),
getOrderAdminByName: builder.query({query:()=>createRequest(`api/v1/admin/orders`)}),
// AddOrdernew:builder.mutation({query:()=>createProductpost(`api/v1/order/new` )}),
// Addproductnew:builder.mutation({query:()=>createProductpost(`api/v1/admin/product/new`)}),
Addproductnew: builder.mutation({
query: newproductid => ({
url: 'api/v1/admin/product/new',
method: 'POST',
body: {newproductid}
}),
}),
}),
})***
import from service mutation and createProduct in array wouldn't read it as a function
const [createProduct] =useCreateProductMutation();
form in homepage
<form onSubmit={() => {createProduct(newProduct)}}>
{/* <form onSubmit={() => {createProduct(newProduct)}}> */}
<input type="text" value={title} placeholder="title" onChange={(e)=>settitle(e.target.value)}/>
<br/>
<input type="text" value={desc} placeholder="desc" onChange={(e)=>setdesc(e.target.value)}/>
<br/>
<input type="text" value={img} placeholder="img" onChange={(e)=>setimg(e.target.value)}/>
<br/>
<input type="number" value={size} placeholder="size" onChange={(e)=>setsize(e.target.value)}/>
<br/>
<input type="text" value={color} placeholder="color" onChange={(e)=>setcolor(e.target.value)}/>
<br/>
<input type="text" value={category} placeholder="category" onChange={(e)=>setcategory(e.target.value)}/>
<br/>
<input type="number" value={price} placeholder="price" onChange={(e)=>setprice(e.target.value)}/>
<br/>
<input type="submit" />
</form>
service RTK query folder
export const productApi = createApi({
// tagTypes: ['Product'],
reducerPath: 'productApi',
tagTypes: ['Post'],
baseQuery: fetchBaseQuery({ baseUrl: "http://localhost:9000/" }),
endpoints: (builder) => ({
getProduct: builder.query({query:(id)=>createRequest(`api/v1/product/${id}`)}),
getAllProductsByName: builder.query({query:()=>createRequest(`api/v1/products`)}),
getOrderAdminByName: builder.query({query:()=>createRequest(`api/v1/admin/orders`)}),
// AddOrdernew:builder.mutation({query:()=>createProductpost(`api/v1/order/new` )}),
// Addproductnew:builder.mutation({query:()=>createProductpost(`api/v1/admin/product/new`)}),
createProduct: builder.mutation({
query: (newProduct) => {
console.log("Create Product:", newProduct)
return {
url: `api/v1/admin/product/new`,
method: 'POST',
body: newProduct,
headers: {
'Content-type': 'application/json; charset=UTF-8',
}
}
}
}),
尝试 post 使用 RTK 查询变异到 nodejs
**endpoint nodejs i have posted using
fetch(`const handleAddproduct=()=>{
fetch('http://localhost:9000/api/v1/admin/product/new',{
method:"POST",
headers:{"Content-Type":"application/json"},
body:JSON.stringify(newproduct)
}).then(()=>{
console.log("new Product added")
})
}`*
but while using rtk mutation it's not post
const handleAddproduct=async()=>{
await Addproductnew(createProduct).unwrap()
.then((payload) => console.log('fulfilled', payload))
.catch((error) => console.error('rejected', error))
}
*export const productApi = createApi({
tagTypes: ['Product'],
reducerPath: 'productApi',
baseQuery: fetchBaseQuery({ baseUrl: "http://localhost:9000/" }),
endpoints: (builder) => ({
getProduct: builder.query({query:(id)=>createRequest(`api/v1/product/${id}`)}),
getAllProductsByName: builder.query({query:()=>createRequest(`api/v1/products`)}),
getOrderAdminByName: builder.query({query:()=>createRequest(`api/v1/admin/orders`)}),
// AddOrdernew:builder.mutation({query:()=>createProductpost(`api/v1/order/new` )}),
// Addproductnew:builder.mutation({query:()=>createProductpost(`api/v1/admin/product/new`)}),
Addproductnew: builder.mutation({
query: newproductid => ({
url: 'api/v1/admin/product/new',
method: 'POST',
body: {newproductid}
}),
}),
}),
})***
import from service mutation and createProduct in array wouldn't read it as a function
const [createProduct] =useCreateProductMutation();
form in homepage
<form onSubmit={() => {createProduct(newProduct)}}>
{/* <form onSubmit={() => {createProduct(newProduct)}}> */}
<input type="text" value={title} placeholder="title" onChange={(e)=>settitle(e.target.value)}/>
<br/>
<input type="text" value={desc} placeholder="desc" onChange={(e)=>setdesc(e.target.value)}/>
<br/>
<input type="text" value={img} placeholder="img" onChange={(e)=>setimg(e.target.value)}/>
<br/>
<input type="number" value={size} placeholder="size" onChange={(e)=>setsize(e.target.value)}/>
<br/>
<input type="text" value={color} placeholder="color" onChange={(e)=>setcolor(e.target.value)}/>
<br/>
<input type="text" value={category} placeholder="category" onChange={(e)=>setcategory(e.target.value)}/>
<br/>
<input type="number" value={price} placeholder="price" onChange={(e)=>setprice(e.target.value)}/>
<br/>
<input type="submit" />
</form>
service RTK query folder
export const productApi = createApi({
// tagTypes: ['Product'],
reducerPath: 'productApi',
tagTypes: ['Post'],
baseQuery: fetchBaseQuery({ baseUrl: "http://localhost:9000/" }),
endpoints: (builder) => ({
getProduct: builder.query({query:(id)=>createRequest(`api/v1/product/${id}`)}),
getAllProductsByName: builder.query({query:()=>createRequest(`api/v1/products`)}),
getOrderAdminByName: builder.query({query:()=>createRequest(`api/v1/admin/orders`)}),
// AddOrdernew:builder.mutation({query:()=>createProductpost(`api/v1/order/new` )}),
// Addproductnew:builder.mutation({query:()=>createProductpost(`api/v1/admin/product/new`)}),
createProduct: builder.mutation({
query: (newProduct) => {
console.log("Create Product:", newProduct)
return {
url: `api/v1/admin/product/new`,
method: 'POST',
body: newProduct,
headers: {
'Content-type': 'application/json; charset=UTF-8',
}
}
}
}),