Tag Archives: javascript

[Solved] SpringBoot Startup Error: org.springframework.beans.factory.UnsatisfiedDependencyException Error creating

Full Error:

WARN 7612 — [ main] ConfigServletWebServerApplicationContext : Exception encountered during context initialization - cancelling refresh attempt: org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name ‘processBusinessController’: Unsatisfied dependency expressed through field ‘userService’; nested exception is org.springframework.beans.factory.BeanCreationException: Error creating bean with name ‘userService’: Injection of resource dependencies failed; nested exception is org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name ‘userMapper’ defined in file [F:code ariacs5g ariacs5g_src ariacs5g-parent ariacs5g-power-parent2 ariacs5g-host-service2 argetclassescom ariacshostmapperUserMapper.class]: Unsatisfied dependency expressed through bean property ‘sqlSessionFactory’; nested exception is org.springframework.beans.factory.BeanCreationException: Error creating bean with name ‘sqlSessionFactory’ defined in class path resource [com/baomidou/mybatisplus/autoconfigure/MybatisPlusAutoConfiguration.class]: Bean instantiation via factory method failed; nested exception is org.springframework.beans.BeanInstantiationException: Failed to instantiate [org.apache.ibatis.session.SqlSessionFactory]: Factory method ‘sqlSessionFactory’ threw exception; nested exception is java.lang.NoClassDefFoundError: org/mybatis/logging/LoggerFactory
2020-12-25 21:55:07.728 INFO 7612 — [ main] o.apache.catalina.core.StandardService : Stopping service [Tomcat]
2020-12-25 21:55:07.737 INFO 7612 — [ main] ConditionEvaluationReportLoggingListener :

Error starting ApplicationContext. To display the conditions report re-run your application with ‘debug’ enabled.
2020-12-25 21:55:07.757 ERROR 7612 — [ main] o.s.boot.SpringApplication : Application run failed

org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name ‘processBusinessController’: Unsatisfied dependency expressed through field ‘userService’; nested exception is org.springframework.beans.factory.BeanCreationException: Error creating bean with name ‘userService’: Injection of resource dependencies failed; nested exception is org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name ‘userMapper’ defined in file [F:code ariacs5g ariacs5g_src ariacs5g-parent ariacs5g-power-parent2 ariacs5g-host-service2 argetclassescom ariacshostmapperUserMapper.class]: Unsatisfied dependency expressed through bean property ‘sqlSessionFactory’; nested exception is org.springframework.beans.factory.BeanCreationException: Error creating bean with name ‘sqlSessionFactory’ defined in class path resource [com/baomidou/mybatisplus/autoconfigure/MybatisPlusAutoConfiguration.class]: Bean instantiation via factory method failed; nested exception is org.springframework.beans.BeanInstantiationException: Failed to instantiate [org.apache.ibatis.session.SqlSessionFactory]: Factory method ‘sqlSessionFactory’ threw exception; nested exception is java.lang.NoClassDefFoundError: org/mybatis/logging/LoggerFactory
at org.springframework.beans.factory.annotation.AutowiredAnnotationBeanPostProcessorKaTeX parse error: Undefined control sequence: \[ at position 78: …sor.java:598) ~\̲[̲spring-beans-5.…doGetBeanKaTeX parse error: Undefined control sequence: \[ at position 34: …ory.java:321) ~\̲[̲spring-beans-5.…doGetBeanKaTeX parse error: Undefined control sequence: \[ at position 34: …ory.java:321) ~\̲[̲spring-beans-5.…AutowiredFieldElement.inject(AutowiredAnnotationBeanPostProcessor.java:595) ~[spring-beans-5.1.18.RELEASE.jar:5.1.18.RELEASE]
… 19 common frames omitted
Caused by: org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name ‘userMapper’ defined in file [F:code ariacs5g ariacs5g_src ariacs5g-parent ariacs5g-power-parent2 ariacs5g-host-service2 argetclassescom ariacshostmapperUserMapper.class]: Unsatisfied dependency expressed through bean property ‘sqlSessionFactory’; nested exception is org.springframework.beans.factory.BeanCreationException: Error creating bean with name ‘sqlSessionFactory’ defined in class path resource [com/baomidou/mybatisplus/autoconfigure/MybatisPlusAutoConfiguration.class]: Bean instantiation via factory method failed; nested exception is org.springframework.beans.BeanInstantiationException: Failed to instantiate [org.apache.ibatis.session.SqlSessionFactory]: Factory method ‘sqlSessionFactory’ threw exception; nested exception is java.lang.NoClassDefFoundError: org/mybatis/logging/LoggerFactory
at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.autowireByType(AbstractAutowireCapableBeanFactory.java:1506) ~[spring-beans-5.1.18.RELEASE.jar:5.1.18.RELEASE]
at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.populateBean(AbstractAutowireCapableBeanFactory.java:1386) ~[spring-beans-5.1.18.RELEASE.jar:5.1.18.RELEASE]
at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.doCreateBean(AbstractAutowireCapableBeanFactory.java:591) ~[spring-beans-5.1.18.RELEASE.jar:5.1.18.RELEASE]
at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.createBean(AbstractAutowireCapableBeanFactory.java:514) ~[spring-beans-5.1.18.RELEASE.jar:5.1.18.RELEASE]
at org.springframework.beans.factory.support.AbstractBeanFactory.lambda$doGetBeanKaTeX parse error: Undefined control sequence: \[ at position 34: …ory.java:321) ~\̲[̲spring-beans-5.…ResourceElement.getResourceToInject(CommonAnnotationBeanPostProcessor.java:637) ~[spring-context-5.1.18.RELEASE.jar:5.1.18.RELEASE]
at org.springframework.beans.factory.annotation.InjectionMetadataKaTeX parse error: Undefined control sequence: \[ at position 53: …ata.java:180) ~\̲[̲spring-beans-5.…doGetBeanKaTeX parse error: Undefined control sequence: \[ at position 34: …ory.java:321) ~\̲[̲spring-beans-5.…E n h a n c e r B y S p r i n g C G L I B EnhancerBySpringCGLIBEnhancerBySpringCGLIB602 d 46 a 8. C G L I B 602d46a8.CGLIB602d46a8.CGLIBsqlSessionFactoryKaTeX parse error: Undefined control sequence: \[ at position 17: …(<generated>) ~\̲[̲mybatis-plus-bo…E n h a n c e r B y S p r i n g C G L I B EnhancerBySpringCGLIBEnhancerBySpringCGLIB602 d 46 a 8 602d46a8602d46a8F a s t C l a s s B y S p r i n g C G L I B FastClassBySpringCGLIBFastClassBySpringCGLIBKaTeX parse error: Undefined control sequence: \[ at position 31: …(<generated>) ~\̲[̲mybatis-plus-bo…BeanMethodInterceptor.intercept(ConfigurationClassEnhancer.java:363) ~[spring-context-5.1.18.RELEASE.jar:5.1.18.RELEASE]
at com.baomidou.mybatisplus.autoconfigure.MybatisPlusAutoConfiguration
E n h a n c e r B y S p r i n g C G L I B EnhancerBySpringCGLIB
EnhancerBySpringCGLIB
602d46a8.sqlSessionFactory() ~[mybatis-plus-boot-starter-3.4.1.jar:3.4.1]
at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method) ~[na:1.8.0_152]
at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:62) ~[na:1.8.0_152]
at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:43) ~[na:1.8.0_152]
at java.lang.reflect.Method.invoke(Method.java:498) ~[na:1.8.0_152]
at org.springframework.beans.factory.support.SimpleInstantiationStrategy.instantiate(SimpleInstantiationStrategy.java:154) ~[spring-beans-5.1.18.RELEASE.jar:5.1.18.RELEASE]
… 58 common frames omitted
Caused by: java.lang.ClassNotFoundException: org.mybatis.logging.LoggerFactory
at java.net.URLClassLoader.findClass(URLClassLoader.java:381) ~[na:1.8.0_152]
at java.lang.ClassLoader.loadClass(ClassLoader.java:424) ~[na:1.8.0_152]
at sun.misc.Launcher$AppClassLoader.loadClass(Launcher.java:338) ~[na:1.8.0_152]
at java.lang.ClassLoader.loadClass(ClassLoader.java:357) ~[na:1.8.0_152]
… 70 common frames omitted

Solution: The introduction of both Mybatis and Mybatis-plus into the dependency will cause a conflict, either one. In addition to noticing if there is a conflict in the pom file of this module, we also need to see if the parent module of this module has already introduced the mybaits dependency and you later introduce the Mybatis-plus module in this module, causing a conflict. This scenario is more insidious and not easy to detect.

[Solved] Uncaught SyntaxError: Invalid Unicode escape sequence

Page error encountered today: Uncaught SyntaxError: Invalid Unicode escape sequence

The parameter in the button click method is a software path, and an error will be reported when passing the parameter. The main reason is that the backslash in JS is caused by the escape character

So just replace the backslash with a double slash to solve the problem: replace(/\\/g,”/”)

[Solved] React Dependency Error: Invalid tag name “^np.0.2“ of package “react@^np.0.2“: Tags may not have an

When writing the carousel diagram, you need to install dependencies. Execute the following command. When you execute, you report an error, saying that it is a version problem. After you reduce the version of react, you search the Internet. Later, when you execute NPM install, you report various dependency errors

  npm install --save react-swipeable-views
    npm install --save react-swipeable-views-utils

The following is the error message: read the error message and say it is a problem with the version of the files in node_modules, but there is still an error after trying to change them. I can only ask you for advice.

the following is the package.json file

{
  "name": "react-goodlive-home",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@babel/core": "^7.16.0",
    "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
    "@svgr/webpack": "^6.3.1",
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "axios": "^0.27.2",
    "babel-jest": "^27.4.2",
    "babel-loader": "^8.2.3",
    "babel-plugin-named-asset-import": "^0.3.8",
    "babel-preset-react-app": "^10.0.1",
    "bfj": "^7.0.2",
    "browserslist": "^4.18.1",
    "camelcase": "^6.2.1",
    "case-sensitive-paths-webpack-plugin": "^2.4.0",
    "css-loader": "^6.5.1",
    "css-minimizer-webpack-plugin": "^3.2.0",
    "dotenv": "^10.0.0",
    "dotenv-expand": "^5.1.0",
    "eslint": "^8.3.0",
    "eslint-config-react-app": "^7.0.1",
    "eslint-webpack-plugin": "^3.1.1",
    "file-loader": "^6.2.0",
    "fs-extra": "^10.0.0",
    "html-webpack-plugin": "^5.5.0",
    "identity-obj-proxy": "^3.0.0",
    "jest": "^27.4.3",
    "jest-resolve": "^27.4.2",
    "jest-watch-typeahead": "^1.0.0",
    "mini-css-extract-plugin": "^2.4.5",
    "postcss": "^8.4.4",
    "postcss-flexbugs-fixes": "^5.0.2",
    "postcss-loader": "^6.2.1",
    "postcss-normalize": "^10.0.1",
    "postcss-preset-env": "^7.0.1",
    "prompts": "^2.4.2",
    "react": "^17.0.2",
    "react-app-polyfill": "^3.0.0",
    "react-dev-utils": "^12.0.1",
    "react-dom": "^17.0.2",
    "react-refresh": "^0.11.0",
    "react-router-dom": "^6.3.0",
    "resolve": "^1.20.0",
    "resolve-url-loader": "^4.0.0",
    "sass-loader": "^12.3.0",
    "semver": "^7.3.5",
    "source-map-loader": "^3.0.0",
    "style-loader": "^3.3.1",
    "tailwindcss": "^3.0.2",
    "terser-webpack-plugin": "^5.2.5",
    "web-vitals": "^2.1.4",
    "webpack": "^5.64.4",
    "webpack-dev-server": "^4.6.0",
    "webpack-manifest-plugin": "^4.0.2",
    "workbox-webpack-plugin": "^6.4.1"
  },
  "scripts": {
    "start": "node scripts/start.js",
    "build": "node scripts/build.js",
    "test": "node scripts/test.js"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "jest": {
    "roots": [
      "<rootDir>/src"
    ],
    "collectCoverageFrom": [
      "src/**/*.{js,jsx,ts,tsx}",
      "!src/**/*.d.ts"
    ],
    "setupFiles": [
      "react-app-polyfill/jsdom"
    ],
    "setupFilesAfterEnv": [
      "<rootDir>/src/setupTests.js"
    ],
    "testMatch": [
      "<rootDir>/src/**/__tests__/**/*.{js,jsx,ts,tsx}",
      "<rootDir>/src/**/*.{spec,test}.{js,jsx,ts,tsx}"
    ],
    "testEnvironment": "jsdom",
    "transform": {
      "^.+\\.(js|jsx|mjs|cjs|ts|tsx)$": "<rootDir>/config/jest/babelTransform.js",
      "^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
      "^(?!.*\\.(js|jsx|mjs|cjs|ts|tsx|css|json)$)": "<rootDir>/config/jest/fileTransform.js"
    },
    "transformIgnorePatterns": [
      "[/\\\\]node_modules[/\\\\].+\\.(js|jsx|mjs|cjs|ts|tsx)$",
      "^.+\\.module\\.(css|sass|scss)$"
    ],
    "modulePaths": [],
    "moduleNameMapper": {
      "^react-native$": "react-native-web",
      "^.+\\.module\\.(css|sass|scss)$": "identity-obj-proxy"
    },
    "moduleFileExtensions": [
      "web.js",
      "js",
      "web.ts",
      "ts",
      "web.tsx",
      "tsx",
      "json",
      "web.jsx",
      "jsx",
      "node"
    ],
    "watchPlugins": [
      "jest-watch-typeahead/filename",
      "jest-watch-typeahead/testname"
    ],
    "resetMocks": true
  },
  "babel": {
    "presets": [
      "react-app"
    ]
  },
  "devDependencies": {
    "less": "^4.1.3",
    "less-loader": "^6.0.0"
  }
}

Solution:

The dependent (@testing-library/react) version is relatively low, and it is useless. Just delete it and restart your computer.

Here is the package.json file after you solved the error

{
  "name": "@testing-library/jest-dom",
  "version": "5.16.5",
  "description": "Custom jest matchers to test the state of the DOM",
  "main": "dist/index.js",
  "engines": {
    "node": ">=8",
    "npm": ">=6",
    "yarn": ">=1"
  },
  "scripts": {
    "build": "kcd-scripts build",
    "format": "kcd-scripts format",
    "lint": "kcd-scripts lint",
    "setup": "npm install && npm run validate -s",
    "test": "kcd-scripts test",
    "test:update": "npm test -- --updateSnapshot --coverage",
    "validate": "kcd-scripts validate"
  },
  "files": [
    "dist",
    "extend-expect.js",
    "matchers.js"
  ],
  "keywords": [
    "testing",
    "dom",
    "jest",
    "jsdom"
  ],
  "author": "Ernesto Garcia <[email protected]> (http://gnapse.github.io)",
  "license": "MIT",
  "dependencies": {
    "@babel/runtime": "^7.9.2",
    "@types/testing-library__jest-dom": "^5.9.1",
    "aria-query": "^5.0.0",
    "chalk": "^3.0.0",
    "@adobe/css-tools": "^4.0.1",
    "css.escape": "^1.5.1",
    "dom-accessibility-api": "^0.5.6",
    "lodash": "^4.17.15",
    "redent": "^3.0.0"
  },
  "devDependencies": {
    "jest-environment-jsdom-sixteen": "^1.0.3",
    "jest-watch-select-projects": "^2.0.0",
    "jsdom": "^16.2.1",
    "kcd-scripts": "^11.1.0",
    "pretty-format": "^25.1.0"
  },
  "eslintConfig": {
    "extends": "./node_modules/kcd-scripts/eslint.js",
    "rules": {
      "@babel/no-invalid-this": "off"
    },
    "overrides": [
      {
        "files": [
          "src/__tests__/*.js"
        ],
        "rules": {
          "max-lines-per-function": "off"
        }
      }
    ]
  },
  "eslintIgnore": [
    "node_modules",
    "coverage",
    "dist"
  ],
  "repository": {
    "type": "git",
    "url": "https://github.com/testing-library/jest-dom"
  },
  "bugs": {
    "url": "https://github.com/testing-library/jest-dom/issues"
  },
  "homepage": "https://github.com/testing-library/jest-dom#readme"
}

[Solved] vite2+vue3 jsx Error: React is not defined

Vite2 + vue3 uses JSX to report an error: react is not defined

If JSX is not used in react, for error reporting:

React is not defined

It is required to add the following configuration to the vite.config.js file:

export default {
  esbuild: {
    jsxFactory: 'h',
    jsxFragment: 'Fragment',
    jsxInject: "import { h } from 'vue';"
  }
}

The last sentence is equivalent to the injection of vite. The helper automatically introduces h

[Solved] Vue2 Cross-domain Error: AxiosError net::ERR_FAILED, Network Error, ERR_NETWORK

Request scenario:

current page URL: http://127.0.0.1:8000/testcase
URL of jump request page: http://127.0.0.1:5000/testcase_orm
When using Axios request, the page prompts cross domain error

Cross-domain error reporting information

Access to XMLHttpRequest at ‘http://127.0.0.1:5000/testcase_orm’ from
origin ‘http://localhost:8080’ has been blocked by CORS policy: No
‘Access-Control-Allow-Origin’ header is present on the requested
resource.

AxiosError {message: ‘Network Error’, name: ‘AxiosError’, code:
‘ERR_NETWORK’

Screenshot of vue2 cross domain error report

through the analysis of the code and the error report information, the problem appears in the cross domain request (cross domain request: the browser does not allow the current source request to access another different source request. The source refers to the request agreement, domain name, and port number. If one of the three is inconsistent, it is a cross domain request)

current URL	request URL	Is it cross-domain	Result analysis
http://www.kuakuakua.com	http://www.kuakuakua.com/index.html	no	Same origin (the same domain name, protocol, and port number)
http://www.kuakuakua.com	https://www.kuakuakua.com	cross domain	Different protocols (http/https)
http://www.kuakuakua.com	http://www.javashuo.com/	cross domain	Different domain names (www.kuakuakua.com/www.javashuo.com)
http://www.kuakuakua.com:8080	http://www.kuakuakua.com:8081	cross domain	Different port numbers (8080/8081)

Solution

Step 1: Find the vue.config.js file in the project directory and open it for editing

insert image description here

Step 2: According to the structure in the figure, copy the given code to module.exports

insert image description here

devServer: {
    proxy: {
      "/proxy_url":{           // /proxy_url This is used to match with the root path baseURL
        target: 'http://127.0.0.1:5000', // this is to fill in the cross-domain request domain + port number, that is, the URL to request (does not include the URL path)
        changeOrigin: true, // whether to allow cross-domain requests, a virtual server will be created locally, then send the requested data, and receive the requested data at the same time, so that the server and the server to interact with the data will not have cross-domain problems
        pathRewrite: { // path rewrite
            '^/proxy_url': '/' // replace the request address in target, the original request is http://127.0.0.1:8000/kuayu the actual request is http://127.0.0.1:8000/proxy_url/kuayu  
        }
      }
    }
  }

Step 3: Find the main.js file and set axios.defaults.baseURL to /proxy_url

axios.defaults.baseURL = ‘/proxy_url’

Step 4: Then the axios request in the methods in the xxx.vue file can be used normally. The complete request URL here is http://127.0.0.1:5000/testcase_orm (Step 4 is just to provide an example, the specific request URL Request according to the URL of your own project)

methods:{
    getCaseList: function(){
        console.log("xxxxxxxxx")
        console.log('Check if the interface call is successful')
        this.$axios.get('/testcase_orm').then((result)=>{
             console.log('Check if the interface call is successful, if it is called, it is successful')
             console.log(result)
        })
    }
  }

Solution Analysis.
Cross-domain problem, you can let the server to add the request header field information and allow cross-domain access, the server-side cross-domain problem is not described in this article, interested to see another Django cross-domain problem solving blog post

The vue cross domain problem is solved by using a proxy solution, which is forwarded to the target server through a proxy on the local server, so that the cross domain is only for the browser, and the cross domain problem does not occur for requests sent by the node service, thus solving the browser cross domain problem.

[Solved] Echarts Error: TypeError: Cannot read properties of null (reading getAttribute )

The above problem was encountered when using echarts

Generally, there are the following cases.
1. echarts.init(document.getElementById("xxxx") is written in the wrong format, such as adding a # in front of the id.

2. initialize operation when the element is not loaded out (stack a debugger on top of the initialized code to easily determine). Here specifically in vue.

If an error is reported you can put the code inside mounted.
mounted() {    
	this.initEcharts();   
}

Differences between mounted and created:

created:Called before the template is rendered into html, applied to initialize some attribute values and then rendered into view requirements.
mounted:Called after the template is rendered into html, to initialize the page and then perform some operations on the dom nodes of the html after it is finished.

[Solved] Error in nextTick: “TypeError: undefined is not iterable

Error in nextTick: “TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))”

The parent component did not pass the corresponding parameter Found:

<label-template
   :image-list="checkImageList"
   :tag-list="tagList"
   @onAllFeatures="onAllFeatures"
   :active-tab="activeTab"
   @next-page="nextPage"
   @previous-page="previousPage"
 />
historicalList.length //The parent component does not pass list, but the child component uses it and gets the length

[Solved] Nuxt Import qrcodejs2.js / QRCode.js Error: document is not defined

preface

qrcodejs2.js/QRCode.js plug-in is in normal Vue.js project works normally. When you are in nuxt.js when used in the project, there will be an error, because qrcodejs2.js/qrcode.js the plug-in internally uses “browser specific (such as window/document) objects”. When compiled into nuxt.js without these, an error will be generated.

This article will provide you with the way to introduce the plug-in from 0-1, which runs perfectly.

Qrcodejs2.js and QRcode JS can be used.

First step

Download the adapter nuxt.js plug-in core code online.

Step 2

Prepare the file you just downloaded.

Put the QRcode.min.js file into the JS folder under the static static directory of the project (create one if you don’t have one).

Step 3

This step requires you to read the notes carefully, and you must understand why the path is written in this way.

Open the project nuxt.config.js configuration file, add the following code to the head configuration item:

// For now, we are using the local IP address http://192.168.3.5:8001 because we are in a development environment.
// Please replace it when you deploy your project later.
// --------- ---------- ---------- ---------- ---------
// For example, my future website deployment will be: http://www.demo.com
// Then this is how it should be written: http://www.demo.com/js/qrcode.min.js
// [domain + /js/qrcode.min.js]

src: 'http://192.168.3.5:8001/js/qrcode.min.js'

As shown in the following figure, pay attention to the position:

Step 4

At this point, your project can use the plug-in.

Cancel your import Import Code:

Test use

Or the original way of use:

// QRCode The keyword is a wrapped instance of the plugin, you can't change it!
let qrcode = new QRCode(qrcodeImgEl, {
    width: 100,
    height: 100,
    colorDark: '#000000',
    colorLight: '#ffffff',
    correctLevel: QRCode.CorrectLevel.H
})

[Solved] vue watch Error: Error in callback for watcher “xxx“: “TypeError: Cannot read properties of undefined …

1. Question

1. Listening to an object in data, an error is reported. The error is strange: you cannot use the apply method on undefined

1) detailed errors are as follows:

vue.esm.js?9b69:5059 [Vue warn]: Error in callback for watcher "flowCategory": "TypeError: Cannot read properties of undefined (reading 'apply')"

found in

---> <FlowItem> at src/projects/comen/implemenceWorkstation/flowSetting/FlowItem.vue
       <ElTabPane> at packages/tabs/src/tab-pane.vue
         <ElTabs> at packages/tabs/src/tabs.vue
           <View> at src/views/implemenceWorkstation/flowSetting/view.vue
             <Index> at src/layout/index.vue
               <App> at src/App.vue
                 <Root>
warn$2 @ vue.esm.js?9b69:5059
logError @ vue.esm.js?9b69:3728
globalHandleError @ vue.esm.js?9b69:3724
handleError @ vue.esm.js?9b69:3691
invokeWithErrorHandling @ vue.esm.js?9b6

2) the code is as follows:

  watch: {
    flowCategory: {
      hanlder(newval, oldval) {
        console.log('flowCategory', newval, oldval);
      },
      deep: true
    }
  }

2. Solution:

After searching for a long time, I found that I had written the word “handler” incorrectly. I typed it incorrectly and wrote it as “hanlder”, and the IDE did not prompt &***&;

Change it to the following. That’s all

  watch: {
    flowCategory: {
      handler(newval, oldval) {
        console.log('flowCategory', newval, oldval);
      },
      deep: true
    }
  }

3. Now we finally understand the error reporting: it is to tell us that the handler has a problem. The watch does not know what to do when monitoring changes.

show dbs Error: [js] uncaught exception: Error: listDatabases failed

When mongo is built with replica set cluster.
If you log into one of the SECONDARY nodes and execute the command show dbs, you will get an error:

2022-08-16T15:20:00.606+0800 E  QUERY    [js] uncaught exception: Error: listDatabases failed:{
    "operationTime" : Timestamp(1660634399, 2),
    "ok" : 0,
    "errmsg" : "not master and slaveOk=false",
    "code" : 13435,
    "codeName" : "NotMasterNoSlaveOk",
    "$clusterTime" : {
        "clusterTime" : Timestamp(1660634399, 2),
        "signature" : {
            "hash" : BinData(0,"NPF356c5NKl0PqHLlmiQ9vey9e4="),
            "keyId" : NumberLong("7101680539345616897")
        }
    }
} :
_getErrorWithCode@src/mongo/shell/utils.js:25:13
Mongo.prototype.getDBs/<@src/mongo/shell/mongo.js:147:19
Mongo.prototype.getDBs@src/mongo/shell/mongo.js:99:12
shellHelper.show@src/mongo/shell/utils.js:906:13
shellHelper@src/mongo/shell/utils.js:790:15
@(shellhelp2):1:1

This is because the SECONDARY node does not have the permission to execute the show dbs command.
In this case, there are two solutions
1. Login to the PRIMARY node
2. Use the cluster connection method
mongo –host testmongo/ip:port,ip:port,ip:port -uusername -p’passwd’ –authenticationDatabase admin

[Solved] Vue Error: Parsing error:No Babel config file detected for xxx

In the Vue project, the following error is reported at the beginning of each file.
Prompt: Parsing error: No Babel config file detected for xxx. Either disable config file checking with requireConfigFile: false, or configure Babel so that it can find the config files.eslint

Solution:
Add “requireConfigFile”: false in “parserOptions” of the package.json file as below:

npm run dev Error: opensslErrorStack: [ ‘error:03000086:digital envelope routines::initialization error‘ ]

report errors:

Solution:

Method 1: Replace the scripts part in package.json:

 "scripts": {
    "dev": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
    "serve": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service serve",
    "lint": "eslint --ext .js,.vue src",
    "build:prod": "SET NODE_OPTIONS=--openssl-legacy-provider && vue-cli-service build",
    "build:stage": "vue-cli-service build --mode staging",
    "preview": "node build/index.js --preview",
    "new": "plop",
    "svgo": "svgo -f src/icons/svg --config=src/icons/svgo.yml",
    "test:unit": "jest --clearCache && vue-cli-service test:unit",
    "test:ci": "npm run lint && npm run test:unit"
  }

Method 2: reduce the node version

ProgrammerAH

Programmer Guide, Tips and Tutorial