我没有提交,并且状态在Vuex中已更新

时间:2020-08-13 18:03:58

标签: vue.js vuex

我有一个令人沮丧的问题,结果是我有一个select /选项,我在其中选择了一个项目,然后打开了一个模态,只需单击“添加/更新到表”,它将提交到“ itemstabla”状态,但是结果是,当我将其提供给表中的项目进行编辑并且模型被打开并且例如将数量更改为另一个数字时,状态“ itemstabla”将更新而不执行提交,仅应在单击时完成模态按钮。

enter image description here

我的商店:

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <parent>
        <artifactId>MineWars</artifactId>
        <groupId>net.havocmc.gamemodes.minewars</groupId>
        <version>1.0-SNAPSHOT</version>
    </parent>

    <modelVersion>4.0.0</modelVersion>

    <artifactId>core</artifactId>

    <repositories>
        <!-- Protocol Lib -->
        <repository>
            <id>dmulloy2-repo</id>
            <url>http://repo.dmulloy2.net/content/groups/public/</url>
        </repository>

        <repository>
            <id>md_5-public</id>
            <url>http://repo.md-5.net/content/groups/public/</url>
        </repository>

    </repositories>

    <dependencies>

        <!-- For NMS access -->
        <dependency>
            <groupId>org.spigotmc</groupId>
            <artifactId>spigot-1.12</artifactId>
            <version>1.12</version>
            <systemPath>${basedir}/../library/spigot-1.12.2.jar</systemPath>
            <scope>system</scope>
        </dependency>

        <dependency>
            <groupId>net.havocmc.util.currency</groupId>
            <artifactId>GameModeUtils</artifactId>
            <version>1.0</version>
            <scope>compile</scope>
        </dependency>

        <dependency>
            <groupId>com.comphenix.protocol</groupId>
            <artifactId>ProtocolLib-API</artifactId>
            <version>4.4.0</version>
            <scope>provided</scope>
        </dependency>

        <dependency>
            <groupId>LibsDisguises</groupId>
            <artifactId>LibsDisguises</artifactId>
            <version>9.9.7</version>
            <scope>provided</scope>
        </dependency>

        <!--Weapons-->
        <dependency>
            <groupId>net.havocmc.weapons</groupId>
            <artifactId>Weapons</artifactId>
            <version>1.5</version>
            <scope>compile</scope>
            <exclusions>
                <exclusion>
                    <groupId>*</groupId>
                    <artifactId>*</artifactId>
                </exclusion>
            </exclusions>
        </dependency>

        <!--Utils-->
        <dependency>
            <groupId>net.havocmc</groupId>
            <artifactId>Utilities</artifactId>
            <version>1.5</version>
            <scope>compile</scope>
            <exclusions>
                <exclusion>
                    <groupId>*</groupId>
                    <artifactId>*</artifactId>
                </exclusion>
            </exclusions>
        </dependency>

    </dependencies>

    <build>
        <defaultGoal>clean compile package install</defaultGoal>
        <sourceDirectory>${basedir}/src/main/java/</sourceDirectory>
        <finalName>${project.name}</finalName>
        <plugins>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-jar-plugin</artifactId>
                <version>3.2.0</version>
            </plugin>

            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-compiler-plugin</artifactId>
                <version>3.8.1</version>
                <configuration>
                    <source>1.8</source>
                    <target>1.8</target>
                </configuration>
            </plugin>
        </plugins>
    </build>

</project>

我的文件Vue:

    let store = {
      state: {
        token: localStorage.getItem('access_token') || null,
        items: [],
        itemstabla: [],
        monedas: [],
        impuestos: [],
        venta: [],
        estadotienda: '',
      },
      getters: {
        loggedIn(state) {
          return state.token !== null
        },
      },
      mutations: {
        EliminarItemTabla(state, item) {
          var index = state.itemstabla.findIndex(c => c.id == item);
          state.itemstabla.splice(index, 1);
       },
        retrieveToken(state, token) {
          state.token = token
        },
        setmonedas(state, monedas) {
          state.monedas = monedas
        },
        setventa(state, venta) {
          state.venta = venta
        },
        setitemstabla(state, items) {
          let found = state.itemstabla.find(item => item.id == items.id);
          
          if(found) {
            if(items.accion=='agregar') {
              found.cantidad = parseInt(found.cantidad) + parseInt(items.cantidad)
            }  
            else {
              found.cantidad = parseInt(items.cantidad)
            }
          }
          else {
            state.itemstabla.push(items)
          }
          
        },
        actualizaritemstabla(state) {
          state.itemstabla.forEach(function (item) {
            if ((state.venta.moneda_id == 'S/' && item.moneda == 'S/') || (state.venta.moneda_id == '$' && item.moneda == '$')) {
              item.precio = parseFloat(item.precio).toFixed(2)
            }
            else if(state.venta.moneda_id == '$' && item.moneda == 'S/') {
              item.moneda = '$'
              item.precio = parseFloat(parseFloat(item.precio) / parseFloat(state.venta.tipocambio)).toFixed(2)
            }
            else if(state.venta.moneda_id == 'S/' && item.moneda == '$') {
              item.moneda = 'S/'
              item.precio = parseFloat(parseFloat(item.precio) * parseFloat(state.venta.tipocambio)).toFixed(2)
            }
          });
        },
        setimpuestos(state, impuestos) {
          state.impuestos = impuestos
        },
        setmonedaid(state, moneda_id) {
          state.venta.moneda_id = moneda_id
        },
        settipocambio(state, tipocambio) {
          state.venta.tipocambio = tipocambio
        },
        destroyToken(state) {
          state.token = null
        }
      },
      actions: {
        retrieveToken(context, credentials) {
    
          return new Promise((resolve, reject) => {
            axios.post('/api/login', {
              username: credentials.username,
              password: credentials.password,
            })
              .then(response => {
                const token = response.data.access_token
                localStorage.setItem('access_token', token)
                context.commit('retrieveToken', token)
    
                resolve(response)
              })
              .catch(error => {
                reject(error)
              })
          })
    
        },
        destroyToken(context) {
          
          if (context.getters.loggedIn){
            
            return new Promise((resolve, reject) => {
              axios.post('/api/logout', '', {
                  headers: { Authorization: "Bearer " + context.state.token }
                })
                .then(response => {
                  localStorage.removeItem('access_token')
                  context.commit('destroyToken')
      
                  resolve(response)
                })
                .catch(error => {
                  localStorage.removeItem('access_token')
                  context.commit('destroyToken')
    
                  reject(error)
                })
            })
    
          }
        }
      }
    }
    
    export default store

1 个答案:

答案 0 :(得分:1)

像您一样使用editaritem,我认为您实际上是在传递项目本身,因此它作为参考被修改了。

    editaritem(item) {
        $('#editarItem').modal('show')
        this.item = { ...item } // or some way to copy the object 
    }

完成编辑后,对已编辑对象进行实际更新。