デバッガーエラー解決
デバッガを入力した後にエラーが報告されるなど、コンパイラで奇妙な文法上の問題が発生することがありますが、このときは Ctrl+Z を押して戻ることができ、最初に戻ってから問題を解決することもできます。再開する。
クッキー利用
CookieUtils.get はキーを通じて値を取得するため、cookieUtils.set をグローバルに検索してキーと値のペアの設定を表示します。
インターフェース
インターフェイスが 1001 などのエラーを返した場合は、インターフェイス ドキュメントで最初にデバッグしてください。インターフェイスが間違って記述されている可能性があります。
methods:{
//获取课程管理
getClassInfoList(){
admin.getClassInfoList(this.$store.state.schoolId).then(
res=>{
if(res.code==1000){
this.tableData=res.data;
}
else{
this.$message.error("获取课程列表失败!")
}
}
)
},
<el-table
:data="tableData.slice((currentPage-1)*pageSize,currentPage*pageSize)"
border
style="width: 100%;overflow: auto"
height="calc(100vh - 260px)"
ref="table">
t
return{
tableData:[],
```
要素「—el-button」用
ボタンの無効な属性。動的バインディングが必要な場合は、後で認識できるようにコロンを追加する必要があります。
<el-button
type="text"
size="small"
@click="open"
:disabled="Boolean(scope.row.isPublic)"
>公开</el-button
>
在这里插入代码片
あなたを追い出す
1. 例 2. ドキュメント構成項目マニュアル
ヒストグラムはシリーズのバーにあり、スタイルは itemStyle と呼ばれます。
テンプレートでは、ID を持つ div を使用するだけです。
<el-card style="margin-top: 4vh">
<div style="height: 35vh" id="questionChart"></div>
</el-card>
マウント時に適用するメソッドを定義する
created() {
this.$nextTick(() => {
this.questionChartInit();
});
},
基本はこんな感じでIDで要素を取得して変数に代入します
showBars() {
var chartDom = document.getElementById("questionSchool");
var myChart = echarts.init(chartDom);
let option = {
title: {
text: "各学校对应题目统计",
// subtext: 'Fake Data',
left: "left",
},
xAxis: {
type: "category",
data: ["1016系统演示", "东北大学", "管理员专属", "虚拟教研室"],
},
yAxis: {
type: "value",
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true,
},
series: [
{
barWidth: 30,
data: [120, 200, 150, 80, 70, 110, 130],
type: "bar",
},
],
};
定義された複雑なメソッド (インターフェイスの接続後は次のようになります)
questionChartInit() {
this.$api.dev.getSchoolList().then(async (res) => {
var x_data = [];
var y_data = [];
for (var j = 0; j < res.data.length; j++) {
var r = await this.$api.dev.getSchoolClassQuestionNum(res.data[j].id);
for (var i = 0; i < r.data.classData.length; i++) {
x_data.push(r.data.classData[i]);
y_data.push(r.data.questionData[i]);
}
}
var chartDom = document.getElementById("questionChart");
var myChart = echarts.init(chartDom);
let option = {
title: {
text: "各教师对应课程统计",
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "shadow",
// label:{
// formatter:(param)=>{
// console.log(param)
// return param.value
// }
// }
},
},
xAxis: {
type: "category",
data: ["张胜军", "王植", "郭甲腾", "兰天"],
axisLabel: {
rotate: 50,
},
},
yAxis: {
type: "value",
},
series: [
{
barWidth: 30,
data: [10, 20, 30, 43],
type: "bar",
itemStyle: {
color: "#9FE080",
},
},
],
};
myChart.setOption(option);
});
},
!演算子ではありません
引用符で囲む必要があります
デバッグ
開発者ツールでは、ポイントを中断し、コードに従って特定の関数が入力されたかどうかを確認し、
問題が見つかった場合はエラー レポートを確認できます。
よくある間違い
メソッド (関数) はかっこを忘れずに追加する必要があります。!!
括弧ありはメソッド、括弧なしは変数です。!!
これをvueに書かないとメソッドが未定義というエラーが報告されます。
これを忘れずに書いてください。!!! インターフェイスが呼び出されません。理由の大部分は、これが書かれていないことです。。
最初にコピーしたものの名前を変更することを忘れないでください。。。